Midnight Mint
#172A2B#2B4645#80C8B4#DDBD81#E5F0E8
Keep mint for primary actions and labels; dark teal is a supporting surface, not a text color.
Ink on Canvas: 12.81:1. Other pairs need their own check.
Dark Color Palettes with HEX Codes
Start with the darkest canvas and a light ink, then add distinct raised surfaces. Bright colors need less area on dark backgrounds, and subtle borders still need to communicate boundaries.
Loading palettes…
Browse filters
Browse by color, mood, style, or theme. Pick a tag to see matching palettes.
Loading the collection…
Finding palettes for this category.
Adding more palettes...
Adding the next 30 matching palettes.
How to build with dark palettes
Start with several dark neutrals that are distinct at normal viewing conditions. Then choose a light text family and one or two accent colors whose saturation does not overpower every other interface element.
Velvet Plum
#292132#44364E#C5A477#CBA6C7#F1E5EE
Use the light pink for essential text and the medium pink for larger accents, with bronze details kept small.
Ink on Canvas: 12.65:1. Other pairs need their own check.
Navy & Amber
#1C2A3E#334862#8BAABF#E0B769#E9EDF3
Use amber for important fills and blue-gray for supporting elements; never rely on hue alone for status.
Ink on Canvas: 12.32:1. Other pairs need their own check.
Assign colors to real roles
| Role | Practical direction |
|---|---|
| Canvas | The darkest broad background. |
| Raised surface | A lighter dark neutral for cards, menus, and fields. |
| Text | Off-white for primary copy, with muted text tested separately. |
| Accent | A saturated hue for interactive emphasis, not a substitute for all hierarchy. |
Good use cases
- Dark application themes with persistent navigation and cards.
- Media or portfolio layouts where imagery should remain the visual focus.
- Developer/technical interfaces using accent color for state and interaction.