826 tagged design-system, measured the same way as everything else here.
Browse within: design-tokens 390claude-code-plugin 194codex-cli 182frontend-development 182accessibility 138ai-tools 126agentic 120figma 104claude-code-skills 90skills 88ai-design 87nextjs 69tailwindcss 57korea 54
Skill Claude CodeCodex
Generate publication-quality DESIGN.md v2 files from any website URL. Analyzes CSS, typography, colors, components, layout, content, accessibility, state patterns, and iconography to produce a 17-section design system reference that AI agents can use to reproduce the website's visual style. Use when the user wants to…
solinkz/micro-interactions-skill
Skill Claude CodeCodex
Expert micro-interaction architect for mobile apps, web applications, and responsive websites. Use this skill when the user asks to add, build, fix, audit, or consult on micro-interactions, animations, transitions, motion design, gesture feedback, haptics, loading states, skeleton screens, pull-to-refresh, swipe…
Skill Claude CodeCodex
Production-grade UX audit and design guidance skill. Transforms vague design feedback into actionable, implementable recommendations. Two modes: guide (principles + do/don't rules for modern interfaces) and review (structured audit with prioritized fixes). Covers task-first UX, information architecture, CRAP visual…
ajantoniou/fable-design-system
Skill Claude CodeCodex
Award-winning SaaS UI/UX design persona reconstructed from the claude-fable-5 model. Use whenever building, restyling, or extending any website, landing page, SaaS surface, component, or design system — even if the user doesn't say "design." Covers typography in two registers (serif-editorial: Instrument Serif + Inter…
Skill Claude CodeCodex
Generate, parse, and compile a unified DESIGN.md (33 categories, 519 tokens) that compiles to CSS, Tailwind v4, and W3C JSON. Use when creating a new design reference, extracting tokens from an existing site (sigil design extract), switching a project's visual identity, generating compiled token output, or auditing a…
Lrinvl1203/world-class-web-design-os
Skill Codex
Use for end-to-end website or interface design, redesign, implementation, or major visual polish; orchestrates discovery, references, art direction, systems, build, critique, QA, and release gates.
eusouomatt/analog-design-standards
Skill Codex
Portable product design standards for creating, reviewing, or refactoring app UI/UX, especially AI-built web apps, dashboards, CRM surfaces, operational workflows, Home screens, AI chat, command surfaces, artifacts, landing pages, and design-system docs. Use when asked to design, build, critique, improve, or set…
SuanFishXYY/suanfish-design-system
Skill Claude CodeCodex
A Chinese design system for creating and reviewing web interfaces, with multiple design perspectives working together. It focuses on React and Tailwind-based projects.
Skill Claude Code
Generate complete Power BI Desktop theme files from brand colors. Creates production-ready JSON themes with branded canvas backgrounds, CSS design tokens, DAX HTML visual examples, and A4 PDF design system documents. Runs standalone or chained with pbi-lifecycle (auto-saves into the client's Global Theme/pbi-theme/…
Skill Claude CodeCodex
OpenSpec-style design development pipeline for visual direction, UX research, website cloning and reverse-engineering, interaction polish, frontend implementation, and evidence-backed QA. Use for product UI, marketing pages, dashboards, live-page references, pixel-accurate rebuilds, design reviews, and frontend work…
EnzoChen0618/ios-design-swiftui
Skill Claude CodeCodex
Apple ecosystem experience architect skill for SwiftUI development. Invoke this skill whenever the user wants to build, design, review, or polish ANY iOS/iPadOS/macOS interface using SwiftUI — even if they just say "make a screen", "write a SwiftUI view", "help with my app UI", "build an iOS feature", or name any app…
Skill Codex
Build or update Angular 22+ interfaces with NeuralNg when exact component selection, imports, forms, accessibility, SSR, icons, or theming guidance is needed.
Skill Claude Code
Build or update a reusable UI component in src/components/ — primitives, composites, landmarks, content components. Trigger whenever the user wants to create or modify any .astro file under src/components/, add a variant or state to an existing component, do a visual refactor (spacing, hover lift, type), or build a…
Skill Claude Code
Creates dropdown menus with proper click-outside detection and z-index stacking for list contexts. Use when building action menus, context menus, or any dropdown that appears in cards/list items.
Skill Claude Code
Render text and evidence into polished, shareable PNG visuals with one consistent Kenny Style visual grammar. Use this skill whenever the user asks to turn words, notes, articles, quotes, arguments, stories, open-source repository or tool material, technical commands/workflows, explicit WeChat Reading…
Skill Claude CodeCodex
Create frontends, posters, dashboards, and web UIs rooted in Bauhaus and Swiss International Typographic Style (Internationale Typografische Stil) design principles. Use this skill when the user mentions Bauhaus, Swiss design, International Typographic Style, grid systems, Josef Müller-Brockmann, Max Bill, Jan…
draaujpeg/solana-uiux-onboarding-kit
Skill Claude CodeCodex
Diagnoses and fixes the entry experience of Solana products, wallets, DEXs, aggregators and lending apps, using components calibrated on a heuristic study of 13 apps. Use when the user is designing, reviewing or implementing onboarding, wallet creation or import, transaction confirmations, error states, identity…
Skill Claude CodeCodex
Reference for UI components in Elvia's design system ("Elvis"). Covers component-specific guidelines for sizing, coloring, types, ordering, labeling, accessibility attributes, CSS setup, and web-component registration. Use when building, reviewing, or fixing UI in an Elvia frontend, even if the request doesn't name…
Skill Claude CodeCodex
The operating system for elite software engineering in TypeScript, React, and Next.js. Enforces the cognitive models, architecture laws, type-level patterns, component design, visual standards, and performance mandates that separate exceptional software from the ordinary — grounded in named sources (Torvalds…
Skill Claude CodeCodex
TidyFactor Design track — code-native UI design lifecycle engine (Figma alternative). Supports all 7 stages of UI design (Discovery, Foundation, Architecture, Components, Motion, Quality, Delivery) with zero per-page CSS/JS and zero build step. Pluggable CSS foundations (Native, Tailwind utility-first, daisyUI…
chohra-med/claude_design_skill
Skill Claude CodeCodex
Take a UI from a one-line idea to on-brand, shippable design with Claude, in the correct order — brand foundation first, then components, screens, interactions, accessibility, and only then generation via /design. Use whenever someone wants to design, redesign, or generate a screen, page, component, or onboarding flow…
Skill Claude CodeCodex
Reference library of 74 real-world brand design systems (Claude, Linear, Stripe, Vercel, Figma, Apple, Tesla, Spotify, Notion, Supabase, and more) captured as DESIGN.md files — colors, typography, components, layout, elevation. Use when the user wants UI, a landing page, or a component that matches a specific brand's…
Skill Claude Code
Comprehensive Material 3 (Material You) design system skill for Jetpack Compose and Compose Multiplatform (KMP). Covers color tokens, typography, shape, 30+ components, adaptive layout, navigation patterns, dynamic color, dark mode, motion/animation, and accessibility. Compose-first — no web or Flutter code.
Tricholomaaurantiumknottiness355/design-dna
Skill Claude CodeCodex
Extract, define, and apply design DNA across three dimensions: design system (tokens), design style (qualitative feel), and visual effects (Canvas, WebGL, 3D, particles, shaders, scroll effects, etc.). Use this skill when: (1) a user wants to see the full 3-dimension design structure/schema, (2) a user provides…
At most 3 mods per repository are shown here, and a mod shipped inside a plugin is left to that plugin's page — the rest are on their repository pages: