Design System Starter
Create and evolve design systems with design tokens, component architecture, accessibility guidelines, and documentation templates. Ensures consistent, scalable, and accessible UI across products.
Browse reusable instructions for your AI tools. Copy and customize a prompt, or download a skill for a supported agent.

Create and evolve design systems with design tokens, component architecture, accessibility guidelines, and documentation templates. Ensures consistent, scalable, and accessible UI across products.
Generate design systems with color palettes, typography, spacing scales, component tokens, and Tailwind config
UI Review workflow skill. Use this skill when the user needs Review UI code for StyleSeed design-system compliance, accessibility, mobile ergonomics, spacing discipline, and implementation quality and the operator should preserve the upstream workflow, copied support files, and provenance before ...
Design a PostgreSQL-specific schema. Covers best-practices, data types, indexing, constraints, performance patterns, and advanced features
Analyze and optimize SQL queries for performance. Use when improving slow queries, reducing execution time, or analyzing query performance in PostgreSQL and MySQL.
Design NoSQL database schemas for MongoDB and DynamoDB. Use when modeling document structures, designing collections, or planning NoSQL data architectures.
Improve database query performance through indexing, query optimization, and execution plan analysis. Reduce response times and database load.
Generate database schemas from plain English. Use when you need SQL tables fast.
ORM patterns — Drizzle, Prisma, migrations, N+1 prevention, transaction management
Use when applying Atomic Design methodology to organize UI components into quarks, atoms, molecules, organisms, templates, and pages. Core principles and hierarchy.
Review and create distinctive, production-grade frontend interfaces with high design quality and design system compliance. Evaluates using three pillars: frictionless insight-to-action, quality craft, and trustworthy building. USE FOR: PR reviews, design reviews, accessibility audits, design syst...
Extract and consolidate reusable components, design tokens, and patterns into your design system. Identifies opportunities for systematic reuse and enriches your component library.
Design interfaces where colour is never the only way information is communicated. Use when designing status indicators, data visualisations, form validation, alerts, maps, or any content that uses colour to convey meaning. Triggers on: colour blind, color blind, colour alone, color alone, colour ...
定义响应式布局网格系统,包括列、间距、边距和断点行为。
创建完整的排版系统,包括字体选择、字号层级、字重系统、行高系统和字间距系统。确保排版系统符合无障碍标准并支持响应式设计。
WCAG 2.2 accessibility expertise — auto-activates on designer tasks to flag violations before handoff
Set optimal line lengths for readability across typography scales and responsive layouts.
Create logos, interfaces, and visual systems with principles of hierarchy, branding, and usability.
Audit animation code against Disney's 12 principles adapted for web. Use when reviewing motion, implementing animations, or checking animation quality. Outputs file:line findings.
Official GSAP skill for timelines — gsap.timeline(), position parameter, nesting, playback. Use when sequencing animations, choreographing keyframes, or when the user asks about animation sequencing, timelines, or animation order (in GSAP or when recommending a library that supports timelines).
Auto-learns your visual preferences. Adapts to UI, graphics, video, and any creative work.
Optimize resumes for Applicant Tracking Systems, check ATS compatibility, and analyze keyword match. Use when the user mentions ATS, applicant tracking, keyword optimization, parsing, or getting past resume screening software.
Transform weak resume bullets into achievement-focused statements with metrics and impact. Use when the user wants to rewrite bullets, strengthen accomplishments, or add action verbs and impact to their resume.
Find opportunities to add metrics and estimate numbers when exact data is unavailable. Use when the user wants to quantify achievements, add numbers, percentages, or impact metrics to a resume.
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.