Back to Plugins
Aspect Ratio Token Generator

Aspect Ratio Token Generator

Generate fixed-ratio height tokens across every breakpoint in one shot.

Plugin Preview

Aspect Ratio Token Generator preview

About this plugin

Building ratio-locked components across breakpoints means one of two things: a sprawling variant set, or a brittle nest of frames and boolean switches. Neither scales.Aspect Ratio Token Generator takes a different approach. Point it at your existing width variable collection, specify your aspect ratios, and it generates a complete set of named height primitive tokens, one per width x ratio x mode combination, directly inside your variable collection. No manual math. No duplicate work.How it works:1. Select the variable collection containing your column width primitives (e.g. col-1 through col-12 across 6 breakpoint modes)2. Enter your aspect ratios (16:9, 4:3, 1:1, 9:16 - any format)3. Preview the output before committing4. Generate. Done.Output variables are grouped by ratio using Figma's slash notation:height/16-9/col-4-h-16-9height/4-3/col-4-h-4-3Once generated, bind a frame's W to a width token and its H to the matching height token. Switch modes and both dimensions update instantly, fully native, no plugin required at runtime.Designed for design systems that treat variables as primitive tokens, not one-off values.

Plugin Details

Version2
CreatedMarch 8, 2026
Last UpdatedApril 4, 2026
Categoryediting & effects plugins
CreatorDanny Babish
Stats1 installs, 1 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://fonts.googleapis.com
    • https://fonts.gstatic.com