A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.

landing-page awesome-list design-tokens figma design-system vibe-coding vibecoding vibe-design design-md

• Updated Oct 28, 2026

The Developer Tool for Visual Engineers • An Open-Source AI-First Design tool • Visually build, style, and edit your code with AI • World's best, top-most agent recommended #1 Developer tool for Designers and Visual Engineers to design with Real Code.

react design typescript ui ai frontend nextjs ide cursor figma codex design-system design-tool tailwindcss design-to-code supabase vibe-coding vibecoding claude-code visual-engineering

• Updated Oct 21, 2026
• TypeScript

Beautiful & consistent icon toolkit made by the community. Lucide is an open-source icon library that provides 2000+ vector (svg) files for displaying icons and symbols in digital and non-digital projects.

react svg ui-design vue icons svg-icons ui-components figma feather-icons svgs

• Updated Nov 12, 2026
• TypeScript

MCP server to provide Figma layout information to AI coding agents like Cursor

typescript ai mcp cursor figma

• Updated Oct 27, 2026
• TypeScript

Write components once, run everywhere. Compiles to React, Vue, Qwik, Solid, Angular, Svelte, and more.

react builder angular vue compiler solid jsx visual declarative liquid svelte shopify figma no-code solidjs jsx-lite

• Updated Oct 28, 2026
• TypeScript

An easy and fast way to create a Python GUI 🐍

python fast gui drag-and-drop python-script python3 gui-application automatic tkinter learn easy-to-use easy collaborate hacktoberfest figma tkinter-graphic-interface tkinter-widgets tkinter-gui tkinter-python tkinter-designer

• Updated Oct 16, 2026
• Python

DiceBear is an avatar library for designers and developers. 🌍

api avatar pixel-art avatars figma avatar-placeholder avataaars dicebear bottts

• Updated Nov 5, 2026
• Vue

700+ Pure CSS, SVG & Figma UI Icons, 6000+ glyphs, patterns, colors and layouts.

css svg api npm json styled-components icons svg-icons customizable purecss css-icon svg-sprites svg-sprite figma svg-icon-pack retina-ready adobe-xd svg-icon multiple-icons figma-ui-icons

• Updated Aug 26, 2024
• JavaScript

Open-source UI component library and front-end development framework based on Tailwind CSS

javascript css html components typescript webpack eslint hugo prettier ui-components figma design-system ui-library ui-framework tailwind tailwindcss flowbite

• Updated Jun 27, 2026
• HTML

TalkToFigma: MCP integration between AI Agent (Cursor, Claude Code, Codex) and Figma, allowing Agentic AI to communicate with Figma for reading designs and modifying them programmatically.

agent design automation ai mcp cursor figma codex ai-agents llm llms generative-ai agentic agentic-ai model-context-protocol claude-code

• Updated Jul 26, 2026
• JavaScript

Generate responsive pages and apps on HTML, Tailwind, Flutter and SwiftUI.

react html swift typescript responsive conversion svelte flutter figma tailwind tailwindcss swiftui figma-plugins shadcn-ui

• Updated Aug 5, 2026
• TypeScript

Extract any website's complete design system with one command. DTCG tokens, semantic+primitive+composite, MCP server for Claude Code/Cursor/Windsurf, multi-platform emitters (iOS SwiftUI, Android Compose, Flutter, WordPress), Tailwind v4, Figma variables, shadcn/ui, CSS health audit, WCAG remediation, Chrome extension. MIT, Playwright, Node 20+.

css chrome-extension cli ai accessibility web-scraping cursor design-tokens figma design-system npx tailwind design-to-code playwright dtcg shadcn-ui mcp-server claude-code-plugin agent-skill skills-sh

• Updated Nov 11, 2026
• HTML

Free, open source (MIT) SVG icon library: 1,383 icons (1,671 SVGs with solid variants) for React, React Native, Vue, Solid, Flutter, CSS, Figma and Framer.

react css svg open-source react-native vue icons icon-pack svg-icons icon flutter icon-set figma framer react-icons solidjs icon-library vue-icons free-icons iconoir

• Updated Nov 4, 2026
• TypeScript

Awesome Claude Design: 68 ready-to-use design system inspirations in DESIGN.md format. Drop one in, scaffold a full UI in one shot.

figma design-system claude-code design-md claude-design

• Updated Jun 20, 2026

An AI agent that writes (actually useful) code for you

react javascript agent typescript ai figma

• Updated Nov 14, 2024
• TypeScript

Angular components library for awesome people

components ui-design angular mobile typescript ui web best-practices uikit design-patterns component-library ui-components hacktoberfest figma cdk resposive-design

• Updated Nov 12, 2026
• TypeScript

Convert any website to editable Figma designs

react chrome-extension html design-systems angular typescript vue svelte storybook figma design-tools no-code figma-plugins design-to-code figma-plugin jsx-lite

• Updated Aug 19, 2025
• TypeScript

Figma is the first interface design tool based in the browser, making it easier for teams to create software. Join us in https://t.me/figma_linux

electron linux figma figma-app

• Updated Jan 21, 2026
• Svelte

Your design system as an API. Connect AI to Figma for extraction, creation, and debugging.

design-systems ai mcp figma figma-api figma-plugins

• Updated Oct 29, 2026
• TypeScript

Turn Claude into a senior design architect: DTCG tokens, 52 components, WCAG 2.2 AA-AAA, 138 design systems, any-framework code, and 50 objective gates that fail the build instead of faking success.

react ui accessibility ux wcag component-library design-tokens figma design-system ai-agents claude tailwindcss design-to-code dtcg claude-code claude-skills

• Updated Nov 10, 2026
• JavaScript