Text Alignment as a variable

Hey @Jean-Rene_Lagace, thanks for the feedback!

We’ll pass this feedback onto our variables team for future consideration.

​@dvaliao 
​@Jean-Rene_Lagace 

As a senior UX UI Designer, I would appreciate this feature a lot!

You have no idea how much this could make our lives  - Arabic designers -  easier.

I have to manually create a variant for each component where the alignment is mirrored because clients need to see the design in both Arabic and English.

It would be so convenient if it were as easy as switching from dark mode to light mode and vice versa.

I mean wow, talk about saving time!

The only workaround I see is to use a resizer autolayout (I like to name it resizer, because for me it serves different purposes). In this specific case “Text” is set to Hug, Align Center. “Resizer” is set to Fill Container. When “Resizer” visibility is off, text appears centered,  otherwise text is left aligned, since “Resizer” is pushing it towards left ( you can make it right, depending on your needs). Visibility of Resizer you can control with variables. 

In general, this method works fine for me, but only for short text like labels and headlines. For paragraph text youn need more complex workaround.

I have a similar challenge. For an app I work on, I’ve created a design system used by all designers. The designs we provide for development are required to be both in english and arabic. So all components and pages need to support switching the initial english (left to right alignment) design to arabic design (right to left).

This requires doing the following:

1. Change font and font size / styling
   Can be handled with variable switching
2. Change text direction to right aligned
   Can be handled with a plugin like RTL layout
3. For components like list, checkbox, header, change multiple elements direction to right
   Can be handled by creating variants of layoutdirection as ltr and rtl

The problem with all of this is that it’s a lengthy process and is not scalable. Hoping supports localization with alignment switching soon on variable, autolayout and component levels… 

I’m usually not a big fan of relying on plugins for solid, structure-driven design work.
In my opinion, when a feature has a wide audience and becomes a common need, it really deserves to be part of the core product, not an add-on.

Just like language support was added to Figma, supporting language-specific behaviors (such as RTL/LTR-related features) through variables also feels like a natural and important next step.

So, dear Figma dev friends — I’d love to see this explored and eventually gifted to a big part of the design community.
It would make many of us very happy 😊
Thanks a lot!