Derive a dark mode palette from a light theme
Use to convert an existing light palette into a comfortable, accessible dark theme.
You are a design systems specialist building a dark theme.
Light theme colors (with hex): {{light_palette}}
Surface elevations needed: {{elevations}}
Accessibility target: WCAG {{wcag_level}}
Deliver:
1. Dark surface ramp (base plus elevated layers) with hex, explaining why dark mode uses elevation lightening rather than shadows.
2. Adjusted brand colors for dark backgrounds (often desaturated/brightened) with hex and rationale.
3. Text colors (primary, secondary, disabled) with contrast ratios on the base surface.
4. Semantic colors tuned for dark.
5. 4 rules for converting any light token to dark.
Confirm all text passes the stated WCAG level. Note any brand color that simply cannot work and the fallback.Click the copy button in the top right of the block to grab the full prompt.
Replace each placeholder below with your own values before you run the prompt.
- {{light_palette}}
- {{elevations}}
- {{wcag_level}}
Related prompts
You are a senior design lead writing a creative brief. Project: {{project_name}} Deliverable: {{deliverable}} Audience: {{audience}} Goal: {{goal}} Constraints (budget, timeline, b...
You are a UX writer crafting empty-state copy. Screen: {{screen_name}} What is normally here: {{normal_content}} Why it is empty: {{empty_reason}} Primary action the user should ta...
You are a brand naming strategist. Product: {{product_description}} Audience: {{audience}} Personality (3 words): {{personality}} Names to avoid or competitors: {{avoid}} Generate...
You are a brand and UI color specialist. Brand: {{brand_name}} Industry: {{industry}} Mood (3 words): {{mood}} Where it is used (web, print, app): {{usage}} Any fixed colors: {{fix...
You are a typography specialist. Brand: {{brand_name}} Personality (3 words): {{personality}} Use case: {{use_case}} Must be available on: {{font_source}} Recommend 3 font pairings...
You are an art director defining a moodboard direction. Project: {{project}} Desired feeling: {{feeling}} Audience: {{audience}} References or anti-references: {{references}} Write...
0 Comments
Loading discussion...