Skip to main content

Defining a font style including a definition of the font-color is one of the absolut basic design-tasks in webdesign.

 

Please could you explain, why it is not longer possible to add a font color to a font-style.

 

Sorry, but I don´t get it. What is the reason behind this change?

It was never an option in Figma. But yeah, lack of CSS class equivalent is annoying. Something like composed style that could contain multiple different properties, like fills, strokes, etc would solve a lot of things that currently being handled by plugins/clunky workarounds (componentizing text/wrappers), and would bridge a gap between designer/dev world.  

Figma’s recommended approach is to create separate color style/variable and apply it onto text layer instead.


thanks for your comment, but wasn´t that a feature before the last update of Figma?

Anyway, do you know a fast and simple way to define a color for a text-style which can be edited easily and also generally changed for all textboxes containing this text-style.

As far as I understand it, you have to ad a variable with the color code to every single text-box using this font-style. And if you want to  change the overall color of all these text-boxes you edit the variable. Right? 

Or is there an easier way? Thanks in advance


thanks for your comment, but wasn´t that a feature before the last update of Figma?

Anyway, do you know a fast and simple way to define a color for a text-style which can be edited easily and also generally changed for all textboxes containing this text-style.

As far as I understand it, you have to ad a variable with the color code to every single text-box using this font-style. And if you want to  change the overall color of all these text-boxes you edit the variable. Right? 

Or is there an easier way? Thanks in advance


Nope, you couldn’t create font + color styles within the same entity.

Yeah, you are almost right. Create the variable with the desired color (Optionally you can set the scope for the variable so it can be only used for text layers and not shapes or frames for example).

Then the best approach would be to create component of the text box (Assuming you are referring to the input element) with the applied variable you’ve just created, and use the component across your design, instead of treating each individual text box as separate element. In that way you will be able to control both color (using variable) and other properties like stroke/size/additional elements (using master component)


Thank you! 👍

 

And lets hope, that Figma reads this :-)


Reply