# RTL Layouts: Designing for Arabic and Hebrew | Vitra.ai

> Right-to-left is a layout change, not a translation one. What mirrors, what must not, and the details that give away a flipped design to a native reader.

**Canonical URL**: https://www.vitra.ai/general/rtl-layout-localization
**Source**: This is the Markdown rendering of https://www.vitra.ai/general/rtl-layout-localization, generated at build time from that page.

---

4 min read

# RTL Layouts: Designing for Arabic and Hebrew

Right-to-left is a layout change, not a translation one. What mirrors, what must not, and the details that give away a flipped design to a native reader.

[Samhitha J Bhatt](https://www.vitra.ai/author/samhitha)
Senior Product Manager , Vitra.ai
Updated Aug 17, 2026

![RTL Layouts: Designing for Arabic and Hebrew](https://www.vitra.ai/static/images/blog/rtl-layout-localization.jpg)

Table of contents

[Mirroring is the default, not the rule](#mirroring-is-the-default-not-the-rule)

[What must not mirror](#what-must-not-mirror)

[The details that give it away](#the-details-that-give-it-away)

[Checking it](#checking-it)

[FAQ](#faq)

Contributors

[Samhitha J Bhatt](https://www.vitra.ai/author/samhitha)
Senior Product Manager

Subscribe to our newsletter

Subscribe

> **Quick answer —** In a right-to-left layout, reading order reverses so navigation, alignment and progress indicators mirror. Photographs, logos, numbers and anything with an inherent direction must not mirror, and getting that wrong is immediately obvious.[Vitra.ai Universe](https://www.vitra.ai/features/image-translation) translates the layer, then checks the result.

## Mirroring is the default, not the rule

When the reading direction reverses, the interface follows. Navigation moves to the right, text aligns right, back and forward swap, progress fills the other way. Most layout tooling handles this. The failures are in the exceptions, and there are more of them than people expect.

## What must not mirror

Element

Mirror

Why

Navigation, menus, alignment

Yes

Reading order moved

Progress bars and steppers

Yes

Progress follows reading

Back and forward arrows

Yes

Direction is relative

Photographs of products

No

A reversed product is a different product

Logos and wordmarks

No

It becomes a mirrored brand

Numbers and dates

No

Digits read left to right in Arabic too

Clocks and play buttons

No

Physical convention, not reading order

Charts with a time axis

No

Time still runs the way the data does

The photograph rule is the one that reaches customers. Flip an image of a right-handed appliance and you have shown a product that does not exist, which is worse than an odd layout.

Numbers surprise people. Arabic text runs right to left while the numerals inside it run left to right, so a phone number or a price must not be reversed.

## The details that give it away

A native reader spots a machine-flipped design in a second, usually from punctuation and spacing rather than layout.

Parentheses and quotation marks have to reverse. Mixed content — an English product name inside an Arabic sentence — needs bidirectional handling or the brackets around it end up on the wrong sides. Line height usually needs increasing, because Arabic script sits taller than Latin.

And the font has to actually contain the script, with proper joining forms. A brand typeface with no Arabic coverage silently falls back to something that looks nothing like the brand.

## Checking it

[Image translation](https://www.vitra.ai/features/image-translation) handles text inside artwork without flipping the artwork itself, which is the distinction the whole job turns on.

Then check on the [rendered page](https://www.vitra.ai/general/localized-website-testing) or the built screen rather than in a string file, because mirroring problems are invisible until laid out. [Quality control](https://www.vitra.ai/features/quality-control) covers the wording and regional fit; the layout still needs a native reader once, and that hour is worth budgeting.

Public services meet this early, since the languages are set by who lives in the area — [government website translation](https://www.vitra.ai/government/government-website-translation).

## FAQ

**What should be mirrored in a right-to-left layout?** Navigation, text alignment, progress bars, steppers, and directional arrows. Anything whose meaning comes from reading order follows the reading order when it reverses.

**What must never be mirrored for Arabic or Hebrew?** Photographs of products, logos and wordmarks, numbers and dates, clocks, play buttons, and charts with a time axis. Reversing a product photograph shows an item that does not exist.

**Do numbers reverse in Arabic text?** No. Arabic script runs right to left while the numerals within it read left to right, so phone numbers, prices and dates keep their normal order inside a mirrored layout.

**What gives away a poorly done RTL layout?** Punctuation and spacing more than layout. Unreversed parentheses and quotation marks, mishandled mixed-language content, cramped line height, and a fallback font that does not match the brand.

Our blog

## Lastest blog posts

Tool and strategies modern teams need to help their companies grow.

Automotive

[Automotive Brochure Localization by Market](https://www.vitra.ai/automotive/automotive-brochure-localization)
A car brochure is a spec grid, a legal footer and a photo library, all market-specific. What actually has to change, and why the layout decides the schedule.

[Samhitha J Bhatt](https://www.vitra.ai/author/samhitha)
Aug 18, 2026

Automotive

[Automotive Campaign Localization Across Markets](https://www.vitra.ai/automotive/automotive-campaign-localization)
Campaigns run through national companies and dealer networks, so one master becomes hundreds of files. Where the offer text and the disclaimers actually break.

[Samhitha J Bhatt](https://www.vitra.ai/author/samhitha)
Aug 18, 2026

Automotive

[Car Service Manual Translation for Technicians](https://www.vitra.ai/automotive/automotive-service-manual-translation)
A workshop manual is read mid-repair by someone with the car on a lift. What that demands of procedures, torque figures and fault codes, in every language.

[Samhitha J Bhatt](https://www.vitra.ai/author/samhitha)
Aug 18, 2026

[View all posts](https://www.vitra.ai/blog/page/1)

---

## Structured data

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "https://www.vitra.ai/general/rtl-layout-localization"
  },
  "headline": "RTL Layouts: Designing for Arabic and Hebrew",
  "image": [
    {
      "@type": "ImageObject",
      "url": "https://www.vitra.ai/static/images/blog/rtl-layout-localization.jpg"
    }
  ],
  "datePublished": "2026-08-17T00:00:00.000Z",
  "dateModified": "2026-08-17T00:00:00.000Z",
  "author": [
    {
      "@type": "Person",
      "name": "Samhitha J Bhatt"
    }
  ],
  "publisher": {
    "@type": "Organization",
    "name": "Vitra.ai",
    "logo": {
      "@type": "ImageObject",
      "url": "https://www.vitra.ai/static/images/vitra-v-logo.png"
    }
  },
  "description": "Right-to-left is a layout change, not a translation one. What mirrors, what must not, and the details that give away a flipped design to a native reader."
}
```

```json
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://www.vitra.ai"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "General",
      "item": "https://www.vitra.ai/general"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "RTL Layouts: Designing for Arabic and Hebrew",
      "item": "https://www.vitra.ai/general/rtl-layout-localization"
    }
  ]
}
```

```json
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What should be mirrored in a right-to-left layout?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Navigation, text alignment, progress bars, steppers, and directional arrows. Anything whose meaning comes from reading order follows the reading order when it reverses."
      }
    },
    {
      "@type": "Question",
      "name": "What must never be mirrored for Arabic or Hebrew?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Photographs of products, logos and wordmarks, numbers and dates, clocks, play buttons, and charts with a time axis. Reversing a product photograph shows an item that does not exist."
      }
    },
    {
      "@type": "Question",
      "name": "Do numbers reverse in Arabic text?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "No. Arabic script runs right to left while the numerals within it read left to right, so phone numbers, prices and dates keep their normal order inside a mirrored layout."
      }
    },
    {
      "@type": "Question",
      "name": "What gives away a poorly done RTL layout?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Punctuation and spacing more than layout. Unreversed parentheses and quotation marks, mishandled mixed-language content, cramped line height, and a fallback font that does not match the brand."
      }
    }
  ]
}
```