Connect Clawsmith to your coding agent. Ship products like crazy.Unlimited usage during betaGet API Key โ†’
โ† Back to dashboard
clawsmith.com/signal/figma-relative-line-height-variables
โš  IssueWide Openbrowser_extensionLive

A web app that lets designers define relative line-height variables in Figma and sync them to code tokens, filling the gap where Figma variables only accept pixel values

Figma's variable system accepts only absolute pixel values for line-height, preventing designers from storing relative/percentage values (e.g. 1.5x or 150%) as reusable variables across a design system. Every font size then requires its own hardcoded line-height variable, breaking the scalable token contract designers and developers share. The Figma forum request 'Allow percentages for line height' has 271 votes and 191 replies since April 2024, with a Figma team member acknowledging in July 2025 the feature is 'on our radar' but still unshipped. Existing plugin workarounds (Unitless Line Height & Tokens) operate on raw layer values and do not integrate with Figma's native Variables panel or typography token export. The product: a browser extension and Figma plugin combination that intercepts the variables API, lets designers author unitless or percentage line-height tokens, stores them as synthetic variables synced to DTCG-format JSON, and writes the correct CSS unitless output to dev-mode inspect panels. Teams with active design systems can subscribe to keep token files in sync with their design tokens pipeline.

Product Idea from this Signal

A web app and Figma plugin that binds relative line-height values to type-scale variables and keeps them in sync across a design system

462 โ–ฒ

Figma's native variable system only accepts pixel (numeric) values for line-height. Percentage-based line-height tokens are silently skipped when exporting from Tokens Studio to Figma variables, breaking any design system that uses relative line-height (e.g. 1.5x or 150%) as part of its type scale. This plugin solves the problem by storing relative line-height as a multiplier variable, computing the resolved pixel value per text style at apply-time using the bound font-size variable, writing it back to the text layer, and flagging any drift whenever the type scale changes. Designers define their line-height rules once (e.g. heading=1.2, body=1.5, caption=1.4) and the plugin propagates correct computed values across every text style in the file without manual recalculation.

figmadesign-systemstypographytype-scaleline-heightvariablesdesign-tokens
Competitive1 leadsView Opportunity โ†’

Score Breakdown

DISCOURSE_FORUM
462

Gap Assessment

Wide OpenNo dedicated solution exists

Figma's own team acknowledges this as on radar but unshipped as of August 2025. The only third-party solution is a plugin that bypasses the variables system rather than integrating with it. No funded competitor ships a token-aware relative line-height bridge for Figma variables.