Here's how most agencies handle Arabic: they design everything in English, sign it off, then hand the Figma file to someone who flips it and swaps the text. The result is a layout that technically reads right-to-left but feels left-to-right. Spacing is wrong. Typography is wrong. The visual hierarchy was built for Latin letterforms and it shows.
We don't do that. At Wasm, Arabic and English are equal citizens from the first line of CSS. We write margin-inline-start instead of margin-left. We use inset-inline-end instead of right. Every layout decision uses CSS logical properties, which means the entire interface mirrors correctly without a single override or hack.
But RTL isn't just about flipping margins. Arabic typography has its own rhythm. A heading that looks balanced at 700 weight in Space Grotesk looks heavy and cluttered in Arabic at the same weight. We drop Arabic headings to 600 and increase line-height — not because Arabic needs "fixing," but because each script has its own rules for what reads well. Respecting those rules is the job.
If your RTL is a CSS file that overrides your LTR, you built it wrong. Bilingual means both directions are the original.
The content matters too. We don't translate copy — we write it twice. The Arabic version of a headline isn't a Google Translate pass over the English. It's written natively, with phrasing that feels natural to an Arabic reader. Sometimes the Arabic version is shorter. Sometimes it's structured differently. That's not a bug — that's what "bilingual by default" actually means.
The payoff is real. When a user in Baghdad switches to Arabic, the entire experience feels authored — not adapted. The navigation reads naturally. The forms accept input in the right direction. The numbers stay LTR (because Arabic numerals are read left-to-right even in RTL text). Every detail has been thought through, not patched.
هكذا تتعامل معظم الوكالات مع العربية: يصممون كل شيء بالإنجليزية، يعتمدونه، ثم يسلّمون ملف Figma لشخص يقلبه ويبدّل النصوص. النتيجة تخطيط يُقرأ تقنياً من اليمين لليسار لكنه يُحَسّ من اليسار لليمين. المسافات خاطئة. التايبوغرافي خاطئ. التسلسل البصري بُني لحروف لاتينية وهذا واضح.
نحن لا نفعل ذلك. في وسم، العربية والإنجليزية مواطنان متساويان من السطر الأول في CSS. نكتب margin-inline-start بدل margin-left. نستخدم inset-inline-end بدل right. كل قرار تخطيطي يستخدم CSS logical properties، ما يعني أن الواجهة بأكملها تنعكس بشكل صحيح بلا override واحد أو hack.
لكن RTL ليس مجرد قلب هوامش. للتايبوغرافي العربي إيقاعه الخاص. عنوان يبدو متوازناً بوزن 700 في Space Grotesk يبدو ثقيلاً ومزدحماً في العربية بنفس الوزن. نخفّض عناوين العربية إلى 600 ونزيد ارتفاع السطر — ليس لأن العربية تحتاج "إصلاحاً"، بل لأن لكل نظام كتابة قواعده الخاصة لما يُقرأ جيداً. احترام هذه القواعد هو الشغل.
إذا كان RTL عندك ملف CSS يتجاوز LTR، فأنت بنيته خطأ. ثنائي اللغة يعني أن الاتجاهين كلاهما أصلي.
المحتوى مهم أيضاً. نحن لا نترجم النصوص — نكتبها مرتين. النسخة العربية من عنوان ليست تمريرة Google Translate على الإنجليزية. مكتوبة بشكل أصلي، بصياغة تشعر بالطبيعية للقارئ العربي. أحياناً النسخة العربية أقصر. أحياناً هيكلها مختلف. هذا ليس خطأ — هذا ما يعنيه فعلاً "ثنائي اللغة افتراضياً".
العائد حقيقي. حين يبدّل مستخدم في بغداد إلى العربية، التجربة كاملة تبدو مؤلَّفة — لا مُعدَّلة. التنقل يُقرأ بشكل طبيعي. النماذج تقبل الإدخال بالاتجاه الصحيح. الأرقام تبقى LTR (لأن الأرقام العربية تُقرأ من اليسار لليمين حتى في نص RTL). كل تفصيل مدروس، لا مُرقَّع.