Awesome Claude UI Armory
Curated index of frontend/UI skills for Claude Code & AI agents — explore design systems, components, and visual tools.
36 skills
Design Systems
Claude Code Agent Design Kit
AI-powered multi-agent design system generator that creates production-ready UI components, design tokens, and documentation from natural language briefs.
Claude Code Design Kit
AI-powered multi-agent design system generator that creates production-ready UI components, design tokens, and documentation from natural language descriptions.
Claude Design Studio Toolkit
AI-powered design co-pilot with responsive UI engine, design tokens, accessibility validation, and multi-agent workflows for code-first design teams.
Compose Multiplatform Development
Kotlin Multiplatform skill for building cross-platform apps with Compose, Material 3, and Koin dependency injection.
Spine Diagrams
Generate clean architecture diagrams as SVG with deterministic output, designed for LLM integration and presentation-ready layouts.
Anti-Slop Design
Generate 3 structurally distinct design variants from real competitors' patterns, rebuilt in your design tokens with auto-scoring.
Claude ImageGen Skill
AI image generation with design system awareness. Creates DALL-E assets—heroes, OG images, icons—using your design tokens. No API key needed.
Sticky Switcher Funnel Playbook
AI-powered design token engine for conversion optimization, packaging 60 production sites into an adaptive design system with real-time mutations.
Advanced DESIGN.md Toolkit
Claude Code skills to extract design specs from URLs and generate them from structured answers
Arcade Prototyper
Build interactive HTML prototypes using DevRev's production design system and Arcade components in Claude Code.
Architecture Governance Skills
Four composable Claude Code skills for system architecture: arc42, secure design, C4 diagrams, and system design frameworks.
Awesome Design Skill
Access 54+ brand design systems (Linear, Apple, Stripe, Vercel) for Claude Code UI development with complete design specifications.
Claude Design Skills
Archived repository redirecting to active design and frontend skills in claude-code-skills.
CraftedStays Design System
Complete visual system for CraftedStays brand—colors, typography, components, icons, and Claude Code integration.
design-engine
Stack-agnostic design system toolkit for Claude Code with auto-loaded rules, generators, and audit agents across React, Astro, SvelteKit, Obsidian, and CSS.
Design Extractor
AI agent that automatically extracts design systems from codebases and generates paste-ready Figma scripts with tokens, components, and frames.
Design MD Generator
Extract design systems from any website into AI-readable DESIGN.md files with verified tokens and stability classifications.
design-md-skill
Auto-generate a spec-conformant DESIGN.md from your design tokens in 30 seconds. Makes your design system AI-readable from theme.json, Tailwind, CSS variable...
Design System Assets
Generate brand-aware visual assets—icons, hero images, illustrations, OG cards—routed to the right tool and reviewed against your design system before placem...
Design System Kit
Bootstrap and iterate complete design systems in Next.js/Tailwind projects using Claude Code with structured workflows and design intelligence plugins.
Generate Design.md
Create, edit, and validate AI-readable design system files with tokens, colors, typography, and component patterns.
Japanese Web Design Guardrails
Build Japanese-ready web interfaces with CJK typography, cultural patterns, form design, and accessibility standards.
Make Design.md
Extract design systems from websites, HTML, or screenshots and generate Google design.md specification documents automatically.
Morpheme Design Skill
Claude Code skill enforcing Morpheme UI Design System with full specs and 12 example implementations for web pages and components.
Open Design
Open-source alternative to Claude Design. Generate web, desktop, mobile prototypes, slides, and images with AI coding agents—locally, with full control.
Flat Design System
Claude Code skill for building UIs in the instyle.group flat design system with warm-neutral palette, 8px grid, and superellipse corners.
Liquid Glass Design System
Claude skill for building UIs with instyle.group's Liquid Glass design system using warm neutrals, translucent glass, and blur effects.
Email HTML MJML
Generate production-ready HTML emails from conversation using MJML. Outlook-safe, Gmail-optimized, WCAG 2.1 AA accessible.
Skynet Site System
Master playbook for landing page design from 60 shipped sites with niche design tokens, conversion funnels, and client variant switchers.
Theme Factory
Applies professional font and color themes to artifacts including slides, docs, reports, and HTML landing pages with 10 pre-set themes.
TRDR Design System Plugins
Claude Code plugins that apply TRDR Design System to projects—analyze violations and auto-migrate components.
UI Style Extractor
Extract design systems from websites into reusable Markdown guides and validation demos for maintaining UI consistency.
Web Architect
4-agent orchestrator that generates complete design systems, architecture plans, and production-ready code with constrained generation to avoid generic AI ou...
Website Design Systems MCP
Extract complete design systems from websites and generate AI-ready files to replicate design elements efficiently.
UX UI Mastery
A 19-skill design mastery plugin covering typography, colour systems, spacing scales, component APIs, and full WCAG 2.2 compliance.