← Back to Editor

#F7EEDF · #06040F · #5F5B66 · #BF9C73 · #F7DD8D

cool

A 5-color cool palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F7EEDF

Goose Yellow · Beige · Peach Orange

HEX
#F7EEDF
RGB
rgb(247, 238, 223)
HSL
hsl(38, 60%, 92%)
HSB
hsb(38, 10%, 97%)
CMYK
cmyk(0%, 4%, 10%, 3%)
Oklch
oklch(95.2% 0.022 80.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#06040F

Deep Indigo · Black · Deep Sea Blue

HEX
#06040F
RGB
rgb(6, 4, 15)
HSL
hsl(251, 58%, 4%)
HSB
hsb(251, 73%, 6%)
CMYK
cmyk(60%, 73%, 0%, 94%)
Oklch
oklch(11.9% 0.028 292.6)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#5F5B66

Ink Gray · DimGray · Charcoal

HEX
#5F5B66
RGB
rgb(95, 91, 102)
HSL
hsl(262, 6%, 38%)
HSB
hsb(262, 11%, 40%)
CMYK
cmyk(7%, 11%, 0%, 60%)
Oklch
oklch(47.9% 0.018 302.2)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#BF9C73

Ginger · Tan · Warm Sun

HEX
#BF9C73
RGB
rgb(191, 156, 115)
HSL
hsl(32, 37%, 60%)
HSB
hsb(32, 40%, 75%)
CMYK
cmyk(0%, 18%, 40%, 25%)
Oklch
oklch(71.5% 0.069 70.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#F7DD8D

Goose Yellow · Khaki · Lemon Cream

HEX
#F7DD8D
RGB
rgb(247, 221, 141)
HSL
hsl(45, 87%, 76%)
HSB
hsb(45, 43%, 97%)
CMYK
cmyk(0%, 11%, 43%, 3%)
Oklch
oklch(90.2% 0.104 92.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7EEDF
DEE7F7

Analogous

F7E2DE
F7EEDF
F4F7DE

Triadic

F7EEDF
DEF7EE
EEDEF7

Split-Comp.

F7EEDF
DEF4F7
E2DEF7

Tetradic

F7EEDF
DEF7E2
DEE7F7
F7DEF4

Contrast Matrix WCAG 2.1 Contrast

F7EEDF
06040F
5F5B66
BF9C73
F7DD8D
—
17.7
AAA
5.7
AA
2.2
Fail
1.2
Fail
17.7
AAA
—
3.1
AA Large
8.0
AAA
15.2
AAA
5.7
AA
3.1
AA Large
—
2.6
Fail
4.9
AA
2.2
Fail
8.0
AAA
2.6
Fail
—
1.9
Fail
1.2
Fail
15.2
AAA
4.9
AA
1.9
Fail
—
White BG
1.2Fail
20.3AAA
6.6AA
2.6Fail
1.3Fail
Black BG
18.3AAA
1.0Fail
3.2AA Large
8.2AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3E3
05050C
5D5D63
B0B07D
ECECA0

Deuteranopia

F4F4E4
05050C
5E5E63
B2B57F
EDEFA5

Tritanopia

F7E5E6
060A0A
5F6161
BD8586
F6B0B3

Achromatopsia

EFEFEF
060606
5D5D5D
A2A2A2
DCDCDC

Shades & Tints Shades & Tints

#F7EEDF

Dark
Light

#06040F

Dark
Light

#5F5B66

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7eedf;
  --color-2: #06040f;
  --color-3: #5f5b66;
  --color-4: #bf9c73;
  --color-5: #f7dd8d;
}

SCSS

$color-1: #f7eedf;
$color-2: #06040f;
$color-3: #5f5b66;
$color-4: #bf9c73;
$color-5: #f7dd8d;

TAILWIND

colors: {
  'brand-1': '#f7eedf',
  'brand-2': '#06040f',
  'brand-3': '#5f5b66',
  'brand-4': '#bf9c73',
  'brand-5': '#f7dd8d',
}

RGB Array

[247, 238, 223], [6, 4, 15], [95, 91, 102], [191, 156, 115], [247, 221, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #F7EEDF, #06040F, #5F5B66, #BF9C73, #F7DD8D is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f7eedf; --color-2: #06040f; --color-3: #5f5b66; --color-4: #bf9c73; --color-5: #f7dd8d. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This cool-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color