Theme factory
Toolkit for styling artifacts with a theme.
Result: A UI language that stays consistent while the product grows.
Design systems · Anthropic169.9KInstallableOpen skill
Design Skills230 indexed records
Design skills for AI coding agents.
Browse visual styles, design systems, interaction patterns, and workflow skills for building better interfaces with Cursor, Claude Code, Codex, and other AI coding agents.
Popular: Industrial brutalist UI, Minimalist UI, Agency grid layout minimal, Blue cloudy clean modern
10 results in Design systems.
Clear filtersMatching skills
10 local editorial records
Design system
Token architecture, component specifications, and slide generation.
Result: A UI language that stays consistent while the product grows.
Design systems · Next Level Builder117.5KInstallableOpen skill
Apply aesthetic
Apply a visual direction , an archetype (high-end agency, editorial minimal, brutalist, soft-SaaS, dark-tech) or one of 138 named design systems (apple, linear-app, stripe, vercel, notion, m
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Design code
Generate production-ready, accessible, token-driven component code for ANY framework , React+Tailwind, Next.js, SwiftUI, Vue, Svelte, Angular, Solid, Web Components/Lit, React Native, Flutte
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Design component
Design a UI component spec to the house quality bar , anatomy, variants, sizes, the 8 states, token mapping, and accessibility.
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Design tokens
Generate, extend, or audit design tokens in DTCG format with the 3-tier architecture (primitive → semantic → component).
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Figma integration
Keep Figma and code in sync , map the 3-tier DTCG tokens to Figma Variables (collections + modes), sync in either direction, use the Figma MCP when connected, and verify component parity (va
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Governance
Govern how the design system evolves , SemVer for tokens/components, the contribution workflow, deprecation policy, and change communication.
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Migrate design system
Map this token system to or from any external design system (Material Design 3, Apple HIG, Fluent, Carbon, Ant, shadcn/ui, Radix, Chakra, Mantine, Bootstrap…) , adopt their look, build on th
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Token build
Set up or run the token build pipeline , transform the DTCG tokens/*.json (source of truth) into platform artifacts (CSS variables, Tailwind @theme, JS/TS, iOS Asset Catalog, Android, Compos
Result: A UI language that stays consistent while the product grows.
Design systems · Thientan Soparat502InstallableOpen skill
Editorial index
Source-aware by default.
DesignMD owns the local navigation and editorial framing. Source owners keep their original artifacts, licenses, and attribution. Records without a verified artifact are labeled clearly instead of pretending to be installable bundles.