New Participant

Allow percentages for line height

Forum|Forum|2 years ago
April 17, 2024
197 replies
25151 views

Firstly great job Figma Font variables are here!!!

Figma tutorial: Variables for typography

The only thing missing is the use of percentages in the line-height property.

You can not use a percentage in the line-height as it only accepts variables that are a number type.

Although the variables for line-height caters for pixel (absolute) line-heights (10,12,14)- it does not accommodate relative line heights.

In other words you can’t use percentage variables for line heights that are a percentage of the font size (100%, 120%,150%).

Interestingly …You can use a variable for letter-spacing ( which accepts a number variable - but reads it as a percentage) - the challenge remains that line heights by default are absolute not percentages - even though you can input a percentage.

Percentages allow greater flexibility and less calculations

Word around would be to allow formula in a variable
e.g. =[variable] * 1.5

Or figuring out a way for the line height to be toggle between absolute or relative application of the number variable.

Show previous replies

Dominik_Markusic_Gross1

New Member

Hi there! Just hit a wall on this same issue and wanted to add my +1 to it!

My expectation from the line-height field in Figma was for it to accept (at least some of the) values as in the CSS spec of the line-height property:

1.25 = If defined with just a number, interpret it as multiplier of font size, which would allow us to declare it in variables as number
125% = If defined with a percentage symbol, interpret as a multiplier of font size
20px = If defined with px, interpret as a pixel constant

Fingers crossed the team sees this issue and prioritizes it!

Michael Fehrenbach

New Member

+1, along with the rest!

I’m not hand-waving whatever technical hurdle this might be—but I’ll add that this seems like a real feature, solving a real problem, that real designers (real customers) want to work for their real systems on their real projects. (Unlike some… other things that seem to get the product attention, since this suggestion was raised!)

✊

Patrick_Hill

New Member

+1

Mart_Knibbe

New Member

Yes please! This feature is basic but really needed.

Matt Molloy

New Member

Wait, wait, wait. Have I just poured 2 days of work into converting a design system to use variables, only to find out that I can’t actually finish the task?

Martin_Schilde

New Member

Yes, needed.

Purplex Design

New Member

I’m suprised that this isn’t a function given how long ago this was raised. Just the ability to scope text strings to the line height value so we can create % text strings would be a start.