How to flip svg icons for rtl languages online
- Step 1Upload your LTR icon — Paste or upload the original left-to-right SVG icon into the tool. The preview shows the icon in its current orientation.
- Step 2Apply horizontal mirror — Click Mirror Horizontally. The tool applies a scale(-1,1) transform around the SVG's centre point, correctly flipping the icon without shifting its position.
- Step 3Download the RTL variant — Download the mirrored SVG. The output has the transform baked into the path data — no runtime CSS transforms needed, ensuring compatibility with all SVG embed methods.
Frequently asked questions
Which icons should be mirrored for RTL and which should not?+
Mirror directional icons: arrows, chevrons, back/forward buttons, progress bars, sliders, reading direction indicators, timeline icons. Do NOT mirror icons that have no inherent directionality: logos, checkmarks, warning symbols, stars, hearts, and most UI state icons.
Can I use CSS transform: scaleX(-1) instead of baking the flip into the SVG?+
Yes, CSS scaleX(-1) works well for inline SVGs and img tags with known dimensions. However, for sprite sheets, background-image usage, or SVG files shared with design teams, baking the flip into the path data produces a self-contained file that works everywhere.
Does the tool handle SVGs with text elements?+
Text elements are mirrored positionally but their text-anchor attribute is not automatically swapped. For SVGs containing text, you should convert text to paths first (using the Font-to-Path tool) before applying the RTL mirror.
What about icons with complex gradients that have directional stops?+
Linear gradients with x1/x2 attributes are automatically mirrored. The tool swaps x1 and x2 values (e.g., x1=0 x2=1 becomes x1=1 x2=0) so gradient direction is preserved visually after the flip.
Privacy first
Every JAD SVG tool runs entirely in your browser using the DOM API and Canvas. Your SVG files never leave your device — verified by zero outbound network requests during processing.