AI skills
Give your agent a better eye for design.
84 skills
Builds map-based data interfaces with choropleths, heat maps, data-driven colors, legends and inspectors, with reference patterns for animated and three-dimensional data.
Claude CodeCursorCodexGitHub Copilotdata-visualizationmapscolor-scalesdashboard
View skill →
Documents one interaction through its trigger, rules, feedback, timing, repeat behavior and accessibility considerations.
Claude CodeGemini CLIinteraction-designmotiondesign-handoff
View skill →
Defines shared duration and easing tokens, choreography rules and reduced-motion overrides for consistent product-wide animation.
Claude CodeGemini CLImotiondesign-tokensaccessibility
View skill →
Defines consistent naming rules for design tokens, components, layers and assets, with patterns intended to improve searchability and handoff.
Claude CodeGemini CLIdesign-systemsdesign-tokenshandoff
View skill →
Helps choose global, local, utility and contextual navigation, including tab bars, sidebars, breadcrumbs and clear active states for web and mobile products.
Claude CodeGemini CLInavigationinteraction-designmobile-uiinformation-architecture
View skill →
Plans first-run experiences around a first meaningful action, using progressive onboarding, setup wizards, sample data, dismissible tours and actionable empty states.
Claude CodeGemini CLIonboardingempty-statesinteraction-designux
View skill →
Explore alternative interaction flows that differ in sequence, user effort, entry point or commitment, rather than merely changing visual styling.
Claude CodeGemini CLIinteraction-designprototypingux-exploration
View skill →
Structures reusable UX pattern entries with problem context, anatomy, variants, behavior, examples and accessibility notes.
Claude CodeGemini CLIdesign-systemsux-patternsdocumentation
View skill →
Helps choose prototype fidelity and method based on the design question, intended audience and decision at stake, from paper sketches to interactive or coded prototypes.
Claude CodeGemini CLIprototypinginteraction-designux-research
View skill →
Provides cross-platform mobile UI patterns for React Native styling, navigation, safe areas, responsive layouts and gesture-driven Reanimated interactions.
Claude CodeCodex CLICursorOpenCodeAntigravity CLIGitHub CopilotPireact-nativemobile-uiresponsive-designmotion
View skill →
Tunes body-text column widths and responsive reading measure using real content and CSS character-width units.
Claude CodeGemini CLItypographyresponsive-designreadability
View skill →
Guidance for adaptive interfaces using container queries, fluid type and spacing, CSS Grid and mobile-first layouts.
Claude CodeCodexCursorOpenCodeAntigravity CLIGitHub CopilotPiresponsive-designlayoutcss
View skill →
Reviews UI motion code for purposeful movement, easing, duration, transform origin, interruptibility and reduced-motion handling. Produces a before/after findings table and a prioritized verdict.
motionanimation-reviewdesign-engineering
View skill →
Guides assistive-technology testing of web interfaces, including navigation, form labels, ARIA widgets and dynamic announcements with VoiceOver, NVDA and JAWS.
Claude CodeCodex CLICursorOpenCodeAntigravity CLIGitHub CopilotPiaccessibilityscreen-readersqa
View skill →
Guides search inputs, keyboard-friendly suggestions, result presentation, visible filters and useful zero-results recovery for content-heavy interfaces.
Claude CodeGemini CLIsearchfiltersinteraction-designux
View skill →
Adds project-aware shadcn/ui guidance for composing forms, dashboards, overlays and chat interfaces, reusing component registries and semantic design tokens.
Claude Codecomponentsshadcn-uidesign-systemsforms
View skill →
Defines reusable spacing steps and contextual padding, margin and density rules for consistent component layouts.
Claude CodeGemini CLIdesign-systemsspacinginterface-design
View skill →
Models complex UI behavior as explicit states, events, guarded transitions and entry/exit actions.
Claude CodeGemini CLIinteraction-designstate-machinesui-behavior
View skill →
Analyzes existing Stitch screens and their HTML, colors and layout to produce a semantic design-system document for consistent follow-up screen generation.
CodexAntigravityGemini CLIClaude CodeCursorOpenCodedesign-toolsdesign-documentationdesign-systemsstitch
View skill →
Turns rough UI ideas into structured Stitch prompts with explicit component vocabulary, visual style, color roles and page hierarchy, incorporating an existing DESIGN.md when available.
CodexAntigravityGemini CLIClaude CodeCursorOpenCodedesign-toolsstitchprompt-designvisual-hierarchy
View skill →
Plans and builds screen-by-screen UI walkthrough videos from Stitch designs using Remotion compositions, timed transitions, zoom emphasis and text callouts.
CodexAntigravityGemini CLIClaude CodeCursorOpenCodedesign-toolsstitchmotionprototypingremotion
View skill →
Reviews data-table structure, header associations, captions and small-screen alternatives so tabular relationships remain understandable to assistive-technology users.
107 GitHub stars
(repository-wide; checked Oct 17, 2026)
skills.sh installs: not checked
Claude CodeOpenAI CodexGemini CLICursoraccessibilitydata-tablesresponsive-design
View skill →
Build consistent Tailwind CSS v4 interfaces with semantic tokens, component variants, shared patterns and dark-mode themes.
Claude CodeCodexCursorOpenCodeAntigravity CLIGitHub CopilotPidesign-systemstailwinddesign-tokens
View skill →
Applies coordinated color palettes and font pairings to HTML landing pages, slides and other visual artifacts using ten preset themes or a custom theme.
Claude CodeClaude.aiClaude APIthemestypographycolor-palettes
View skill →