Prompts

Ready-to-use prompts for design with AI.

32 resources

Prompting Basics

Practical foundations for writing clear prompts that produce better design and code output.

beginner · 10 min Sign up to read

Design Token Audit Prompt

A prompt that analyzes your design token JSON and identifies issues like missing semantic layers, inconsistent naming, and accessibility gaps.

beginner · 5 min Sign up to read

Accessibility Review

Review a component or page for WCAG 2.1 compliance, covering contrast, keyboard navigation, screen readers, and motion.

beginner · 5 min Sign up to read

Accessibility Prompts

Prompt checklist for enforcing accessibility in AI-generated UI components.

intermediate · 10 min Sign up to read

Adoption Metrics Framework

Define meaningful adoption metrics for your design system, including what to measure, how to collect data, and target benchmarks.

intermediate · 10 min Sign up to read

Semantic Color Mapping

Map primitive color values to semantic design tokens with clear intent, usage rules, and accessibility notes.

intermediate · 10 min Sign up to read

Component Deprecation Notice

Write a clear, actionable component deprecation notice with migration steps, timeline, and replacement guidance.

beginner · 5 min Sign up to read

Component Metadata Prompts

Prompt templates for extracting, documenting, and sharing component metadata.

intermediate · 10 min Sign up to read

Component Documentation Generator

Generate comprehensive component documentation including props, usage guidelines, do's and don'ts, and accessibility notes from a component's code.

beginner · 5 min Sign up to read

Brand-to-Token Mapping

Translate brand guidelines (PDF, style guide) into a structured set of design tokens with proper naming and hierarchy.

intermediate · 10 min Sign up to read

Changelog Entry Writer

Write clear, useful design system changelog entries that help consumers understand what changed and what to do about it.

beginner · 5 min Sign up to read

Component Spec Generator

Generate a full component specification from just a component name, including props, variants, states, tokens, and accessibility requirements.

intermediate · 10 min Sign up to read

Design Critique

Run a structured design critique session using a framework that covers usability, visual design, accessibility, and consistency.

beginner · 10 min Sign up to read

Component Variant Finder

Identify missing variants, states, and edge cases for an existing component by analyzing common UI patterns.

beginner · 5 min Sign up to read

Design System Components Prompts

Prompts for generating components from Figma with MCP and documenting implementation.

advanced · 20 min Sign up to read

Design System Health Check

Run a quick, structured health check on your design system covering tokens, components, documentation, adoption, and tooling.

beginner · 5 min Sign up to read

Design System RFP/Proposal

Write a compelling design system proposal or RFP document to secure buy-in, budget, and headcount from leadership.

intermediate · 10 min Sign up to read

Design System Work: The System Prompt

A drop-in system prompt template for any Claude work that touches your design system. Cache it once, reuse it on every screen, audit, and component review.

intermediate · 10 min Sign up to read

Design Tokens Prompts

Prompt templates for generating, auditing, and syncing design tokens.

intermediate · 15 min Sign up to read

Documentation Prompts

Prompts for generating and maintaining component and design system documentation.

intermediate · 12 min Sign up to read

Figma-to-Code Review

Review AI-generated or hand-written code against a Figma design to catch visual mismatches, missing states, and token drift.

intermediate · 10 min Sign up to read

Force Claude to Output Design Tokens as JSON

A prefill technique that makes Claude return parseable JSON tokens with no preamble, no apology, and no markdown wrapper. Drop-in pattern for token extraction pipelines.

intermediate · 5 min Sign up to read

Icon Naming Convention

Standardize icon naming across your design system with a consistent, predictable naming scheme.

beginner · 5 min Sign up to read

Design System Migration Plan

Generate a step-by-step migration plan for moving between design system versions, tools, or architectures.

intermediate · 10 min Sign up to read

Prototyping Prompts

Prompt templates for building interactive prototypes and implementation-ready handoff artifacts.

intermediate · 15 min Sign up to read

Research Prompts

Prompt templates for user research, competitive analysis, and design trend exploration.

intermediate · 10 min Sign up to read

Responsive Token Generator

Generate responsive design tokens that adapt spacing, typography, and layout across breakpoints.

intermediate · 10 min Sign up to read

Spacing Scale Generator

Create a consistent spacing scale from a base unit, with token names and usage guidelines for layout and component spacing.

beginner · 5 min Sign up to read

Storybook Story Generator

Generate comprehensive Storybook stories for a component, covering all variants, states, and edge cases.

intermediate · 10 min Sign up to read

Dark Mode Token Mapping

Generate dark mode token values from an existing light mode token set, with proper contrast and readability adjustments.

intermediate · 10 min Sign up to read

Token Documentation Generator

Generate clear, structured documentation for a set of design tokens, including usage examples, do's and don'ts, and visual references.

beginner · 5 min Sign up to read

Token Naming Audit

Audit your design token names against naming conventions and flag inconsistencies, typos, and structural issues.

beginner · 5 min Sign up to read