Design Systems skills
Tokens, components and the rules that keep a product consistent as it grows.
98 skills, page 1 of 3
Skills
Ask Mattby mattpocock
Router that picks the right Matt Pocock engineering flow for the current task.
Design SystemsExternalGitHub stars: 306.5K
Codebase Designby mattpocock
Guidance for designing deep modules with small interfaces and clean seams.
Design SystemsExternalGitHub stars: 306.5K
Domain Modelingby mattpocock
Builds and sharpens project domain models and terminology.
Design SystemsExternalGitHub stars: 306.5K
Engineeringby mattpocock
Routing bundle for code work covering planning, debugging, TDD, architecture, and execution flows.
Design SystemsExternalGitHub stars: 306.5K
Grill with Docsby mattpocock
Sharpens the domain model and updates supporting docs while grilling through design choices.
Design SystemsExternalGitHub stars: 306.5K
Improve Codebase Architectureby mattpocock
Scans a codebase for deepening opportunities and turns them into a prioritized visual report.
Design SystemsExternalGitHub stars: 306.5K
Prototypeby mattpocock
Builds throwaway prototypes to answer design or logic questions quickly.
LayoutExternalGitHub stars: 306.5K
Setup Matt Pocock Skillsby mattpocock
One-time repo setup for the engineering skill workflow and related conventions.
Design SystemsExternalGitHub stars: 306.5K
To Issuesby mattpocock
Breaks a plan or PRD into independently actionable issues.
Design SystemsExternalGitHub stars: 306.5K
To Prdby mattpocock
Turns a conversation into a PRD and publishes it to the issue tracker.
Design SystemsExternalGitHub stars: 306.5K
Triageby mattpocock
Moves issues through a structured triage state machine.
Design SystemsExternalGitHub stars: 306.5K
Frontend Designby anthropics
Create distinctive, production-grade frontend interfaces with high design quality. Generates creative, polished code and UI design that avoids generic AI aesthetics.
VisualExternalGitHub stars: 184.8K
Banner Designby nextlevelbuilder
Design banners for social media, ads, website heroes, creative assets, and print. Multiple art direction options with AI-generated visuals. Actions: design, create, generate banner. Platforms: Facebook, Twitter/X, LinkedIn, YouTube, Instagram, Google Display, website hero, print. Styles: minimalist, gradient, bold typography, photo-based, illustrated, geometric, retro, glassmorphism, 3D, neon, duotone, editorial, collage. Uses ui-ux-pro-max, frontend-design, ai-artist, ai-multimodal skills.
VisualExternalGitHub stars: 142.5K
Brandby nextlevelbuilder
Brand voice, visual identity, messaging frameworks, asset management, brand consistency. Activate for branded content, tone of voice, marketing assets, brand compliance, style guides.
VisualExternalGitHub stars: 142.5K
Designby nextlevelbuilder
Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations (Chart.js), banner design (22 styles, social/ads/web/print), icon design (15 styles, SVG, Gemini 3.1 Pro), social photos (HTML→screenshot, multi-platform). Actions: design logo, create CIP, generate mockups, build slides, design banner, generate icon, create social photos, social media images, brand identity, design system. Platforms: Facebook, Twitter, LinkedIn, YouTube, Instagram, Pinterest, TikTok, Threads, Google Ads.
VisualExternalGitHub stars: 142.5K
Design Systemby nextlevelbuilder
Token architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales, component specs, strategic slide creation. Use for design tokens, systematic design, brand-compliant presentations.
VisualExternalGitHub stars: 142.5K
Slidesby nextlevelbuilder
Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
VisualExternalGitHub stars: 142.5K
Ui Stylingby nextlevelbuilder
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing design systems, creating responsive layouts, adding accessible components (dialogs, dropdowns, forms, tables), customizing themes and colors, implementing dark mode, generating visual designs and posters, or establishing consistent styling patterns across applications.
VisualExternalGitHub stars: 142.5K
Ui Ux Pro Maxby nextlevelbuilder
Comprehensive UI/UX design intelligence with 50+ styles, 97 palettes, and 9 technology stacks for building professional interfaces.
VisualExternalGitHub stars: 142.5K
Shadcnby shadcn-ui
Project-aware shadcn/ui workflow for searching, adding, composing, and fixing components with correct patterns.
Design SystemsExternalGitHub stars: 126.9K
Frontend Ui Engineeringby addyosmani
Frontend UI engineering guidance covering component architecture, responsive design, accessibility, and maintainable implementation patterns.
LayoutExternalGitHub stars: 111.7K
Brandkitby Leonxlnx
Premium brand-kit image generation skill for creating high-end brand-guidelines boards, logo systems, identity decks, and visual-world presentations. Trained for minimalist, cinematic, editorial, dark-tech, luxury, cultural, security, gaming, developer-tool, and consumer-app brand systems. Optimized for intentional logo concepting, refined composition, sparse typography, strong symbolic meaning, premium mockups, art-directed imagery, and flexible grid layouts.
VisualExternalGitHub stars: 105.4K
Gpt Tasteby Leonxlnx
High-agency UX/UI skill with strict layout variance, typography, and GSAP motion engineering constraints.
TasteExternalGitHub stars: 105.4K
Minimalist Uiby Leonxlnx
Editorial minimal interfaces with monochrome palettes, typographic contrast, and restrained visuals.
TasteExternalGitHub stars: 105.4K
Stitch Design Tasteby Leonxlnx
Semantic design-system skill for Google Stitch with strict anti-generic UI generation rules.
Design SystemsExternalGitHub stars: 105.4K
Adaptby pbakaus
Adapt designs across breakpoints, device contexts, and platform constraints with responsive interaction quality.
InteractionExternalGitHub stars: 95.1K
Clarifyby pbakaus
Improve labels, microcopy, and UX messaging so interface text is clearer and easier to act on.
InteractionExternalGitHub stars: 95.1K
Colorizeby pbakaus
Introduce strategic color systems to interfaces that feel dull, monochrome, or visually flat.
VisualExternalGitHub stars: 95.1K
Distillby pbakaus
Simplify noisy interfaces by removing non-essential complexity and restoring clear visual focus.
Design SystemsExternalGitHub stars: 95.1K
Hardenby pbakaus
Make interfaces production-ready with robust empty states, edge cases, errors, onboarding, and i18n resilience.
Design SystemsExternalGitHub stars: 95.1K
Impeccableby pbakaus
Flagship design skill for production-grade, anti-generic frontend interfaces with strong craft and consistency.
TasteExternalGitHub stars: 95.1K
Layoutby pbakaus
Fix spacing, composition, and hierarchy rhythm when UI layout feels crowded, flat, or misaligned.
TasteExternalGitHub stars: 95.1K
Polishby pbakaus
Final quality pass for spacing, alignment, and consistency to prepare UI for launch.
TasteExternalGitHub stars: 95.1K
Quieterby pbakaus
Tone down overly intense designs while keeping quality high and preserving hierarchy.
VisualExternalGitHub stars: 95.1K
Shapeby pbakaus
Plan feature UX before coding via a structured design interview that produces an actionable design brief.
InteractionExternalGitHub stars: 95.1K
Pick Ui Libraryby emilkowalski
Choose an opinionated, trusted library for common frontend tasks including components, motion, charts, interaction, state, and styling.
LayoutExternalGitHub stars: 51.4K
Prototypeby emilkowalski
Build multiple genuinely different UI variants behind a visual picker so the strongest direction can be evaluated and promoted.
LayoutExternalGitHub stars: 51.4K
Write Swiftby emilkowalski
How to write modern Swift well — modeling with value types, Swift 6 data-race safety and approachable concurrency (@concurrent, main-actor-by-default, actors, task groups), protocols and generics (some vs any), API design, performance and ARC, Swift Testing, macros, and the modern language features agents don't know about yet. Use when writing, reviewing, or migrating Swift, or when a concurrency error, a hang, a data race, a retain cycle, or a performance problem needs fixing.
LayoutExternalGitHub stars: 51.4K
Vercel React Best Practicesby vercel-labs
Vercel React best practices for rendering performance, bundle efficiency, and scalable component architecture.
LayoutExternalGitHub stars: 33.2K
Define Goalby openai
Help the user define a concrete, measurable goal before starting work, especially when they ask to use the goal tool, create a goal, set an objective, clarify success criteria, or turn a fuzzy intention into a quantitative outcome. Use this skill for goal creation and goal refinement only; it does not manage durable snapshots, decision logs, or long-running execution artifacts.
Design SystemsExternalGitHub stars: 28.4K
Other categories
- Layout203
- Typography11
- Motion63
- Interaction107
- Accessibility79
- Responsive8
- Forms32
- Navigation12
- Visual147
- Performance34
- Taste73
- Writing5