skills.rest
ecomfeecomfeOfficial·1 Agent Skills Included

tempad-dev

Convert Figma designs into project-consistent UI code

Converts Figma selections into production-ready UI code that matches your project's framework, styling system, tokens, and components. Eliminates manual pixel measuring, CSS inspection, and guesswork when translating designs into code. Reads local project conventions first, then fetches exact design data so agents implement faithful interfaces faster.
489|38
↗
npx skills add ecomfe/tempad-dev --all -g -y
Available:

Routes coding agents to the correct package-level guides and enforces repo-wide conventions, verification commands, and change boundaries when working on this project.

All Skills in This Repository (1)

Pure Emerald Level Indicators
📦 In Repo
ecomfeecomfe

implementing-figma-ui-tempad-dev

Translate Figma selections into project-native UI code via TemPad Dev MCP.

Official
Advanced

Frequently Asked Questions

FAQPage Schema
How to install TemPad Dev?▼

Run `npx skills add ecomfe/tempad-dev --all -g -y` in your terminal to install the Figma design-to-code skill globally.

How to convert Figma designs to code?▼

Select an element in Figma with the TemPad Dev extension active, then ask your agent to implement it. The skill fetches exact styles, tokens, and assets via MCP and writes code matching your project conventions.

Does TemPad Dev work with Tailwind projects?▼

Yes. It detects your Tailwind setup and theme scales, then preserves exact values like spacing and font sizes instead of coarsening them into named utilities.

Can TemPad Dev export Figma assets and SVGs?▼

Yes. It exports assets through local URLs and marks themeable SVGs so they can adopt a contextual color like currentColor in your codebase.

Which editors support the TemPad Dev skill?▼

Any MCP-compatible client works, including Claude Code, Cursor, and Codex, as long as the TemPad Dev browser extension is connected to your Figma file.

Related Repositories in Design & Creative

View All in Design & Creative→
nextlevelbuildernextlevelbuilder
123.5k

ui-ux-pro-max-skill

AI design intelligence for professional UI, brands, and presentations

Official📦 13 Skills
shadcn-uishadcn-ui
122.7k

ui

Build and customize beautiful React component libraries with AI

Official📦 2 Skills
nexu-ionexu-io
93.2k

open-design

Open-source AI design studio for decks, prototypes, images, and video

Official📦 394 Skills