Flip CSS (LTR to RTL)
Convert left-to-right (LTR) CSS into right-to-left (RTL) CSS for Arabic, Hebrew and Persian sites, and back.
How to useFlip CSS to RTL.
Flip CSS (LTR to RTL): what it is for
Paste the CSS and the tool swaps left and right, flips four-value margin, padding, border-width and border-radius, adjusts float, text-align, direction, cursors, shadows and translateX, so the layout works in right-to-left languages. Declarations marked with /* norotate */ stay as they are.
How to use
- Paste the original CSS.
- Check the flipped CSS.
- Copy it into the RTL version of the site.
When to use it
- Translate sites into Arabic or Hebrew.
- Adapt CSS themes and libraries.
- Compare LTR and RTL layouts.
Frequently asked questions
What does the tool change?
It swaps left and right in properties and values (margin-left, padding-right, float, text-align, left/right), flips the four-value shorthands of margin, padding, border-width and border-radius, swaps direction ltr and rtl, cursors like e-resize and w-resize and the sign of translateX.
Can I keep a line from being flipped?
Yes. Add the comment /* norotate */ or /*rtl:ignore*/ at the end of the declaration and it stays as is.
Wouldn’t logical properties be better?
For new CSS, yes: margin-inline-start, padding-inline-end and inset-inline-start adapt to the text direction by themselves. This tool is useful to convert old or third-party CSS.
Is it really free?
Yes, 100% free. No sign-up, no subscription and no usage limits. All Tools123 are free.