Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →

fitoe/designtocode

1 skill · 1 installs · 6 stars · GitHub

Install

npx skills add https://github.com/fitoe/designtocode

Skills in this repo

1Design To CodeDesignToCode is an agent skill for developers who have static design segments—Figma exports, marketing slices, or reference screenshots—and want implementation that respects an existing frontend stack rather than a generic HTML dump. The default flow asks the agent to run a pre-implementation brief first so spacing, typography, and UnoCSS conventions match the repo, then generates page structure and styles from the segmented images. When bitmaps are missing, Asset Fulfillment may use atlas generation only for small batches of visually related assets within strict guardrails: two to eight images in the same family, with mandatory post-generation cropping into separate files referenced in code. The skill explicitly rejects atlas shortcuts for heroes, CTA backgrounds, portraits, logos, and unrelated mixed roles, pushing CSS or individual generations where quality control matters. Intermediate to advanced users get the most value when they already use UnoCSS and can review cropped assets and layout fidelity. It accelerates frontend work for landing pages and marketing surfaces without replacing design critique or accessibility review.1installs

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.

fitoe/designtocode · 1 skills · Skillselion