Direction — Astro
RTL/LTR wrapper: sets dir on a container for bidirectional content.
Direction
Wrapper that sets dir="ltr" or dir="rtl" on the container for right-to-left or left-to-right content.
Add this component
Run the command below in your project directory. When prompted, select the component(s) you want. The CLI will copy the CSS and component files.
Choose your package manager — click a tab to select, then copy the command.
npm pnpm yarn bun
npm 
pnpm 
yarn 
bun Live Example
RTL
This paragraph is right-to-left. Use for Arabic, Hebrew, or mixed-direction layouts.
Usage
Usage
Full example for each framework (Astro, Vanilla, Svelte, Vue, React). Switch framework via View as or by clicking a Usage tab—both stay in sync.
Astro Vanilla Svelte Vue React