UI Pattern Generator
Generate a composed UI pattern (card layout, list, form section, grid, etc.) using design system primitives
Browse reusable instructions for your AI tools. Copy and customize a prompt, or download a skill for a supported agent.

Generate a composed UI pattern (card layout, list, form section, grid, etc.) using design system primitives
Score a UI file's design quality 0-100 against StyleSeed's design language — per-category breakdown, the worst offenders, and a prioritized fix list. A quantified version of /ss-review.
Interactive setup wizard — guides you step-by-step to configure the design system for your project
Use before UI-related work to select the smallest useful UI Skills context through the ui-skills CLI.
View, add, or modify design tokens in the StyleSeed design system
Rigorous visual validation expert specializing in UI testing, design system compliance, and accessibility verification.
Audit screens for UX issues using Nielsen's heuristics and modern mobile UX best practices
Generate UX microcopy (button labels, error messages, empty states, toasts) following a casual-but-polite voice and tone
Design user flows and navigation structure following proven UX patterns
Audit decision friction and propose clear, accessible UX flows when layout, defaults, or sequencing obstruct informed action.
Evaluate interfaces against 168 research-backed UX/UI principles, detect antipatterns, and inject UX context into AI coding sessions.
54 real design systems (Stripe, Linear, Vercel) as HTML/CSS.
Throwaway HTML mockups: 2-3 design variants to compare.
Figma integration. Manage Files, Projects, Teams. Use when the user wants to interact with Figma data.
WCAG 2.1 AA compliance patterns, screen reader compatibility, keyboard navigation, and ARIA best practices. Use when implementing accessible interfaces, reviewing UI components, or auditing accessibility compliance. Covers semantic HTML, focus management, color contrast, and assistive technology ...
Creates comprehensive design systems with typography, colors, components, and documentation for consistent UI development. Use when establishing design standards, building component libraries, or ensuring cross-team consistency. Keywords: design-tokens, typography, spacing, color-palette, compon...
Creates intuitive user experiences through feedback patterns, microinteractions, and accessible interaction design. Use when designing loading states, error handling UX, animation guidelines, or touch interactions.
Author/validate/export Google's DESIGN.md token spec files.
Visual designer — brand identity, color systems, typography, design tokens, and UI design.
UI/UX design intelligence. 67 styles, 96 palettes, 57 font pairings, 25 charts, 13 stacks. Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, bl...
Design one-off HTML artifacts (landing, deck, prototype).
AI Agent 团队 - 61 个专业 Agent,8 大部门,完整的 AI 代理机构。支持单 Agent 使用和多 Agent 协作编排。
Audit a Figma component library for consistency, coverage gaps, and naming issues. Use when asked to audit components, review a design system, check component consistency, identify missing components, or assess Figma library health. Produces a structured audit report with issues prioritised by im...
Plan prototype interactions and flows for user testing in Figma. Use when asked to plan a Figma prototype, set up prototype interactions, define what to prototype for a user test, or prepare a Figma prototype for usability testing. Produces a prototype scope, interaction specification, test task ...
Try another platform, a broader search, or fewer filters.
Explore all resourcesResource formats: Prompts are ready to copy into a conversation. Skills install into the compatible agent shown on their page.
How it worksInclude the instructions, intended platforms, author, and license. Submissions are reviewed before publication.