Skip to content
Digital Transformation
All insights

Web Development

Arabic support is not a CSS flip

7 min read

Most bilingual sites in this region treat Arabic as English rendered backwards. Here is the specific list of things that breaks, and what correct actually looks like.


Setting dir="rtl" takes an afternoon. Everything after that is the actual work, and it is the part that gets cut when a launch date slips.

Numbers that become undialable

Place an international phone number inside an Arabic paragraph and the bidirectional algorithm will reorder the run that begins with the plus sign. The result looks like a phone number and is not one. The same class of bug silently corrupts version strings, IBANs, date ranges and anything wrapped in parentheses.

Letter-spacing destroys Arabic

Arabic script is cursive: letters join. A design system that applies tracking to headings — completely normal for Latin display type — will pull those joins apart and render text that is not merely ugly but noticeably harder to read. Tracking must resolve to zero in Arabic, at the token level, not by remembering to override it.

Which numerals, actually?

Eastern Arabic-Indic numerals are standard in Egypt and read as formal or traditional to much of the Gulf and Levant. For a technology vendor's site aimed at business readers, Western digits are the safer default: they match how technical content is written region-wide, and they keep figures copy-pasteable.

Plurals are not one-or-many

English has two plural forms. Arabic selects between six — zero, one, two, few, many and other — and the dual is a distinct word, not a number followed by a noun. Any interface that says "2 مشروع" was built with an English mental model. Use ICU plural rules and let the locale decide.

Motion has a direction too

An arrow that nudges right on hover, a carousel that advances leftward, a progress bar that fills from the left — each of these carries a directional meaning that inverts in Arabic. Mirroring them is easy; noticing all of them is not, which is why direction-aware motion belongs in the component library rather than in each page.

Tell us what you're trying to build.

A short conversation is usually enough to tell you whether we're the right team — and if we're not, we'll say so.