Prompts

Curated AI prompts for design, product, research, and content workflows

19 prompts

Visual design

UI Component Specification

Generate a detailed UI component specification with states, variants, and interaction patterns.

uicomponentsspecification
Visual design

Visual Hierarchy Design

Design effective visual hierarchy for layouts to guide user attention and improve readability.

visual-hierarchygraphic-designlayout
Visual design

Design System Component Visual Spec Writer

Developer-friendly visual specs: anatomy, tokenized properties per variant/state, spacing, responsive behavior, and accessibility for one component cluster.

visual-designdesign-systemcomponents
Visual design

Color Palette & Typography System Builder

Production-oriented foundations: primitive scales, semantic tokens, contrast tables, dark mode mapping, modular type scale, and token naming for tools like Style Dictionary.

visual-designdesign-systemcolor
Visual design

UI Layout & Composition Explorer

Three layout concepts (hierarchy-first, density, progressive disclosure), a recommended direction, grid spec, visual hierarchy ranking, and edge cases before detailed design.

visual-designlayoutcomposition
Visual design

Visual Hierarchy Audit

Structured critique of an existing screen from a detailed description: attention flow, hierarchy scores, P1/P2 issues, contrast flags, spacing, prioritized fixes, before/after for the top fix.

visual-designvisual-hierarchycritique
Visual design

Design Completeness Checklist

Ensure designs are complete and ready for handoff with comprehensive state coverage.

design-handoffdesign-qachecklist
Visual design

Component Prioritization Matrix

Identify, inventory, and prioritize which design system components to build first based on usage, impact, and dependencies.

design-systemcomponent-libraryprioritization
Visual design

Design System Documentation

Create comprehensive documentation for design system components including usage guidelines, code examples, and best practices.

design-systemdocumentationcomponent-library
Visual design

Design System Rollout Strategy

Plan how to roll out a design system to teams including migration, training, adoption, and support strategies.

design-systemrolloutadoption
Visual design

Design Tokens Definition

Create a comprehensive design tokens system for design systems.

design-tokensdesign-systemtokens
Visual design

Design Handoff Documentation

Create comprehensive design handoff documents with specs, assets, and implementation details for developers.

handoffdocumentationspecification
Visual design

Design System Component Creation

Create new design system components with variants, states, documentation, and usage guidelines.

design-systemcomponentsspecification
Visual design

Design Token Audit

Audit design tokens for consistency, identify duplicates, and recommend consolidation strategies.

design-tokensdesign-systemaudit
Visual design

Design System to AI Prompt Converter

Convert design system documentation into AI-friendly prompts for generating prototypes that match your design system exactly.

design-systemaiprototyping
Visual design

AI Prototype Design System Validation

Validate AI-generated prototypes against design system requirements and identify inconsistencies to fix.

design-systemvalidationai
Visual design

Design System Audit

Conduct a comprehensive audit of a design system for consistency and improvements.

design-systemauditconsistency
Visual design

Extract Design System from Screenshot

Analyze a screenshot and extract a comprehensive design system including colors, typography, spacing, and components.

design-systemscreenshotanalysis
Visual design

Extract Design System Using Figma MCP

Use Figma MCP (Model Context Protocol) to extract a complete design system from Figma files, including components, styles, and tokens.

design-systemfigmamcp