Love-in-a-Mist Color Palette
#E7EBEC · #39479E · #232E76 · #090F3A
Use #E7EBEC as the background. Use #39479E as the primary accent. Use #232E76 as secondary. Use #090F3A as body text/supporting color. Palette mood: Love-in-a-Mist — cool, pastel, vintage, forest, moody.
Hex Codes, RGB & CMYK Color Values
Technical breakdown for the Love-in-a-Mist color scheme. Use these values for web design (HEX/RGB), print projects (CMYK), or specialized design software (HSL).
| Swatch | Design Role | HEX | RGB | CMYK | HSL |
|---|---|---|---|---|---|
| Background Luminance: 82.5% | 231, 235, 236 | 2%, 0%, 0%, 7% | 192°, 12%, 92% | ||
| Primary Accent Luminance: 7.8% | 57, 71, 158 | 64%, 55%, 0%, 38% | 232°, 47%, 42% | ||
| Secondary Luminance: 3.6% | 35, 46, 118 | 70%, 61%, 0%, 54% | 232°, 54%, 30% | ||
| Body Text Luminance: 0.7% | 9, 15, 58 | 84%, 74%, 0%, 77% | 233°, 73%, 13% |
Love-in-a-Mist Tints & Shades
Hover states, borders and elevation need lighter and darker steps of your base colors. Here are computed tints and shades for every color in the Love-in-a-Mist palette — click any swatch to copy its hex.
Love-in-a-Mist Palette Contrast Matrix (WCAG 2.1)
Every color tested as text on every other color as background. Body copy needs 4.5:1 (AA), large text and UI components 3:1. AAA requires 7:1.
| Text on Background | Preview | Ratio | Grade | Safe For |
|---|---|---|---|---|
| #090F3A on #E7EBEC |
Aa Sample Text
| 15.33:1 | AAA | Body text, headings, UI |
| #E7EBEC on #090F3A |
Aa Sample Text
| 15.33:1 | AAA | Body text, headings, UI |
| #232E76 on #E7EBEC |
Aa Sample Text
| 10.15:1 | AAA | Body text, headings, UI |
| #E7EBEC on #232E76 |
Aa Sample Text
| 10.15:1 | AAA | Body text, headings, UI |
| #39479E on #E7EBEC |
Aa Sample Text
| 6.81:1 | AA | Body text, UI |
| #E7EBEC on #39479E |
Aa Sample Text
| 6.81:1 | AA | Body text, UI |
| #090F3A on #39479E |
Aa Sample Text
| 2.25:1 | Fail | Decorative use only |
| #39479E on #090F3A |
Aa Sample Text
| 2.25:1 | Fail | Decorative use only |
| #090F3A on #232E76 |
Aa Sample Text
| 1.51:1 | Fail | Decorative use only |
| #232E76 on #090F3A |
Aa Sample Text
| 1.51:1 | Fail | Decorative use only |
| #232E76 on #39479E |
Aa Sample Text
| 1.49:1 | Fail | Decorative use only |
| #39479E on #232E76 |
Aa Sample Text
| 1.49:1 | Fail | Decorative use only |
Color Harmony: Custom Scheme
The Love-in-a-Mist palette is built using a custom relationship between its hues. This ensures that even with high-contrast accents, the overall scheme feels balanced and intentional.
A custom palette is often preferred by professional designers because it balances visual interest with cohesion.
History & Design Context
Best Design Use Cases
Industries This Palette Suits
Colors That Pair Well With Love-in-a-Mist
Need a fifth color? These three companions are computed from the palette's own hue positions on the color wheel, so they extend the scheme without breaking its harmony.
directly opposite #39479E on the wheel — the strongest accent for CTAs and highlights when you need maximum energy
30° beside #39479E — a calm secondary that extends the palette without adding tension
a ink-black carrying the palette's own hue — perfect for surfaces and dividers
Using Love-in-a-Mist Without Breaking Accessibility
- Use #39479E for buttons and links — it scores 6.8:1 against the #E7EBEC background (above the 3:1 UI-components threshold).
- Set body text in #090F3A — 15.3:1 against #E7EBEC passes WCAG AA (AAA) for long-form reading.
- Let #232E76 carry sidebars, cards and footers — at a mid lightness it separates zones without stealing focus from #39479E.
How to Implement the Love-in-a-Mist Color Scheme
To use this Love-in-a-Mist color palette in your web project, you can copy the following CSS variables or Tailwind CSS configuration. These roles ensure your UI maintains accessibility and visual hierarchy.
Option 1: CSS Variables
:root {
/* {name} Palette - ihatecolors.com */{'
'} --color-bg: {colors[0]};{'
'} --color-primary: {colors[1]};{'
'} --color-secondary: {colors[2]};{'
'} --color-text: {colors[3]};{'
'} {'}'} Web Design Tip
Use #E7EBEC for the main background and #39479E for primary buttons. This creates a high-contrast focal point.
Accessibility Note
The contrast ratio between #090F3A and #E7EBEC is 15.33:1 (AAA). Ensure your body text remains legible.
Love-in-a-Mist Palette — Frequently Asked Questions
What are the hex codes in the Love-in-a-Mist color palette?
The Love-in-a-Mist palette contains #E7EBEC, #39479E, #232E76, #090F3A. Click any swatch on this page to copy its value, or export all four at once as CSS variables, Tailwind config, SCSS or a Figma-ready list.
Is the Love-in-a-Mist color palette accessible (WCAG)?
Yes for its strongest pairings: #090F3A on #E7EBEC reaches 15.3:1 (AAA). For body text always keep a 4.5:1 ratio and for large UI elements 3:1 — the full contrast matrix above shows the exact score for every color-on-color combination in this palette.
What colors go well with the Love-in-a-Mist palette?
Beyond its own four colors, #9D9039, #614393, #141515 extend it naturally: the complementary hue for high-energy accents, an analogous neighbor for calm transitions, and a tinted neutral for surfaces. All three are computed from this palette's hues on the color wheel.
What mood does the Love-in-a-Mist palette create?
Love-in-a-Mist reads as cool, pastel, vintage. Gently saturated blue drives the personality, grounded by muted cyan-blue — a combination that works best when the very light base gets most of the canvas.
Can I use the Love-in-a-Mist color palette commercially?
Yes. Individual color values can't be copyrighted, so the Love-in-a-Mist palette is free for personal, client and commercial work — websites, branding, apps, print and social content, with no attribution required.
How do I add the Love-in-a-Mist palette to Tailwind or CSS?
Use the export panel on this page: CSS variables, a Tailwind config block, SCSS variables, or a Figma copy list are generated from Love-in-a-Mist's exact values, including the tint and shade ramps shown above.