DEV Community

loading...
Cover image for How to add RTL support in Figma

How to add RTL support in Figma

Syeda Aimen Batool
@Outreachy Intern at @Mozilla ❯ Full Stack JavaScript Developer ❯ Opensource Contributor ❯ Google Cloud's fan
・2 min read

Around 20 countries in the world speak a language that is written RTL (right-to-left). Thus, RTL support is necessary for any digital device either web or mobile.
Currently, Figma doesn't support RTL language but there are a few community plugins that help us achieve the goal. Let's look into it.

Problem:

By default when we write an RTL text in Figma it does the following:
It won't show the text IF you haven't selected an RTL supporting font.
It won't automatically make the text RTL. Rather, the individual characters of your text will be written LTR.

Alt Text

Solution:

To fix the issue above we need to install a third-party plugin developed by Figma community members. I have selected the Arabic & RTL Support plugin developed by Ahmad Alhaddad for this tutorial.

Steps:

  • Click on the mentioned link and it will take you to the plugin page
  • Click on install and it will automatically load into the Figma
  • In Figma, write some RTL and from plugins select the installed plugin to fix the direction of the text

Alt Text

There is a list of a few more RTL plugins in the library you can find and install the best that suits your requirements.
Learn what is Redux and how it manages the state Or tweet me @aimenbatool.

Discussion (0)