DesignAdvanced4.3
Design System Color Tokens
560likes2Ksaves1.2Kuses
design-system design system patterns
Compatible Platforms
💬GPT-4o🌐v0🤖Claude 3.5 Sonnet
Tags
design-system
The Prompt
Create a complete color token system: semantic naming convention (primary, secondary, surface, error, success, warning), dark mode variants with proper contrast ratios (WCAG AAA), scale with 10 shades per hue, automated contrast checking, brand color derivation from primary, neutral scale for text and borders, and documentation for design and development teams
Share this Prompt
How to Use This Prompt
- 1
Copy the Prompt
Click the "Copy Prompt" button above to copy the full prompt text to your clipboard.
- 2
Open Your AI Platform
Go to one of the compatible platforms: GPT-4o, v0, Claude 3.5 Sonnet.
- 3
Paste & Generate
Paste the prompt into the AI tool and enjoy the results. Tweak as needed for your specific use case.
Related Prompts
Design5
Dark Mode Design System
Create an accessible dark mode design
View prompt
Design5
Micro-Interaction Library
Design a micro-interaction library
View prompt
Design5
Form Design Best Practices - Patterns
form design system patterns
View prompt
Design5
Icon System Design - Patterns
icons design system patterns
View prompt
Design5
Micro-interaction Design
micro-interactions design system patterns
View prompt
Design5
Icon System Design
icons design system patterns
View prompt