Back to Plugins
Styles to Components by Tokyo

Styles to Components by Tokyo

Generate clean components from Figma Styles — colors, type, and effects.

Plugin Preview

Styles to Components by Tokyo preview

About this plugin

Turns your local Figma Styles into three tidy component boards: Colors, Typography, and Effects.Supports multiple shadows & blurs (drop/inner/layer/background), auto-fits details, dark effect previews, and updates in place. Create near cursor, update existing frames where they are.Features1-click boards: 🎨 Colors, 🔤 Typography, ✨ EffectsReads your local Styles; preserves folder order4-across layout with clean spacingEffects: multiple layers summarized (offsets, blur, spread, color)Create at cursor, update in placeNo network; runs entirely in the editorGreat forDesign systems, style audits, handoff boards, and spec reviews.

Plugin Details

Version4
CreatedSeptember 3, 2025
Last UpdatedSeptember 7, 2025
CategoryFile organization plugins
CreatorEnmanuel Yasell
Stats5 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:
    • none