A Figma plugin that extracts typography and colors from your designs and generates a visual style guide — with optional AI-powered naming via Claude.

• Typography & Color Extraction — Scans text layers and colors from any selected frame. Groups typography by font family with a full type scale table, and organizes colors by hue with shade tokens (e.g., green-50 through green-900).
• Figma Local Styles — Automatically creates reusable Text Styles and Paint Styles in your file, and syncs them to all matching layers.
• AI-Powered Naming (Optional) — Connect a Claude API key for smarter, context-aware naming. Works great without AI too.
• Duplicate Detection — Flags styles with the same font/size but different parameters (e.g., line-height 1.5 vs 1.4). Review side-by-side, keep or remove, add notes for context. Decisions are cached per artboard.
• Layer Ignore Prefix (@i) — Prefix any layer or group name with @i to exclude it from extraction. Useful for illustrations or decorative elements that would pollute your style guide.
• Multi-Artboard — Select multiple frames and extract from all of them at once.

1. Select a frame or artboard
2. Choose Typography, Colors, or both → click "Extract Styles"
3. Review and resolve any duplicates (if detected)
4. Plugin generates a visual style guide + creates Figma Local Styles
5. Styles are auto-synced to your layers

npm install
npm run build

In Figma: Plugins → Development → Import plugin from manifest... → select manifest.json

For AI features: get a key from console.anthropic.com, paste it in the plugin's AI Settings.

npm run build    # Compile + bundle
npm run watch    # Watch mode

Tech stack: TypeScript, esbuild, Figma Plugin API

src/
├── code.ts                    # Main plugin orchestration
├── ui.html                    # Plugin UI panel
├── extractors/                # Text & color extraction
├── generators/                # Style guide frame generation + Figma style creation
├── utils/                     # Naming, color, font, AI merge utilities
└── sync/                      # Apply styles to design layers

MIT