Nocturne Berry Cove
A warm palette of 6 colors drawing on black, pink, beige, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 11.66:1, enough for body text.
About this palette
A warm palette of 6 colors drawing on black, pink, beige, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 11.66:1, enough for body text. Open any color for its conversions, shades, harmonies and contrast.
Colors
- ≈ Shot in the Dark#1C0E18
A very dark, neutral pink (Shot in the Dark) that brings softness and care. White text sits comfortably on it.
- ≈ Castro#3D2336
A dark, muted red (Castro) that brings warmth and energy. White text sits comfortably on it.
- ≈ Bruise#76456A
A medium, moderately saturated pink (Bruise) that brings a warm, expressive tone. White text sits comfortably on it.
- ≈ Lily#BF99AF
A light, muted pink (Lily) that brings a warm, expressive tone. Dark text reads well on it.
- ≈ Guava Glow#E2C4D9
A very light, muted pink (Guava Glow) that brings a warm, expressive tone. Dark text reads well on it.
- ≈ Jaffa#E2772B
A medium, vivid orange (Jaffa) that brings playful warmth. Dark text reads well on it.
Tags
Psychology
Meaning
Applications
Similar palettes
Plum Peach
Crimson Noir
Rose Quartz Night
Sunset Boulevard
Rosewood Studio
Midnight Ember
Accessibility
- On white18.66:1Excellent 5/5
- On black13.13:1Excellent 5/5
- Color blind friendly99% similarExcellent 5/5
Contrast is the best any color in the palette reaches on a plain white or black background. Color blind friendly shows how much of the difference between the colors is kept under the common kinds of color blindness.
Colors and suggested roles
| Color | Role | HEX |
|---|---|---|
| Shot in the Dark | Background | #1C0E18 |
| Castro | Surface | #3D2336 |
| Bruise | Primary | #76456A |
| Lily | Secondary | #BF99AF |
| Guava Glow | Light | #E2C4D9 |
| Jaffa | Accent | #E2772B |
CSS variables
:root {
--background: #1C0E18;
--surface: #3D2336;
--primary: #76456A;
--secondary: #BF99AF;
--light: #E2C4D9;
--accent: #E2772B;
}
Tailwind v4 (@theme)
@theme {
--color-background: #1C0E18;
--color-surface: #3D2336;
--color-primary: #76456A;
--color-secondary: #BF99AF;
--color-light: #E2C4D9;
--color-accent: #E2772B;
}