--- title: "RTL (Right to Left)" description: "Fylgja CSS works out of the box for right-to-left (RTL) languages such as Arabic and Hebrew." faq: - question: Do I need a separate RTL stylesheet or RTL-prefixed utility classes? answer: No, Fylgja CSS automatically mirrors the layout for RTL languages once dir="rtl" is set. There's no separate RTL stylesheet or rtl:-prefixed classes to add. - question: What's the minimum setup needed to enable RTL? answer: Add dir="rtl" and an appropriate lang attribute (e.g. lang="ar") to the element. - question: Can I force part of a page to stay LTR inside an RTL page? answer: 'Yes, add dir="ltr" to that specific element, or apply direction: ltr; in CSS to enforce it locally.' - question: Do Fylgja's utilities work in RTL, or just the base styles? answer: All of them. Fylgja only ships RTL-aware utilities; spacing, alignment, and positioning are built on logical properties (e.g. margin-inline, inset-inline, text-start) instead of physical left/right, so they mirror automatically under dir="rtl" with no directional variants to swap. --- Fylgja CSS offers seamless support for right-to-left (RTL) languages like Arabic and Hebrew without requiring additional CSS or prefixed RTL utility classes. Fylgja CSS automatically applies the correct styles to ensure a proper RTL layout. ## RTL Language Layout When working with RTL languages, it's essential not only to translate text but also to mirror the layout to align with the text direction for a semantically correct presentation. To enable RTL behavior, ensure the following HTML attributes are set: - Add `dir="rtl"` to the `` element. - Set an appropriate language attribute, such as `lang="ar"`, on the `` element. This setup enables RTL functionality, eliminating the need for extra CSS or plugins. 😉 ## RTL-Aware Utilities This mirroring isn't limited to the base styles. Fylgja only ships RTL-aware utilities, so the [Utilities](/docs/library/utilities) package behaves the same way. Spacing, alignment, and positioning are built on logical properties (`margin-inline`, `inset-inline`, `text-start`, and so on) rather than physical `left`/`right` ones. As a result, there are no directional variants to swap: the same utility that adds inline-start spacing in LTR adds it on the opposite side in RTL, automatically. ## Forcing a Specific Text Direction If you need to force a left-to-right (LTR) layout regardless of the language or text direction, apply one of the following: - Add `dir="ltr"` to the specific HTML element where you want this behavior. - Use the CSS property `direction: ltr;` to enforce LTR on the desired element.