← Back to Editor

#F4DBBD · #ACC7B6 · #6CA59F · #355D5F · #04070E

A 5-color palette 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

#F4DBBD

Goose Yellow · Wheat · Peach Orange

HEX
#F4DBBD
RGB
rgb(244, 219, 189)
HSL
hsl(33, 71%, 85%)
HSB
hsb(33, 23%, 96%)
CMYK
cmyk(0%, 10%, 23%, 4%)
Oklch
oklch(90.4% 0.048 72.2)

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

#ACC7B6

Celadon · Silver · Apple Green

HEX
#ACC7B6
RGB
rgb(172, 199, 182)
HSL
hsl(142, 19%, 73%)
HSB
hsb(142, 14%, 78%)
CMYK
cmyk(14%, 0%, 9%, 22%)
Oklch
oklch(80.5% 0.038 157.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#6CA59F

Mineral Blue · CadetBlue · Lake Green

HEX
#6CA59F
RGB
rgb(108, 165, 159)
HSL
hsl(174, 24%, 54%)
HSB
hsb(174, 35%, 65%)
CMYK
cmyk(35%, 0%, 4%, 35%)
Oklch
oklch(68.1% 0.060 187.5)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#355D5F

Slate Blue · DarkSlateGray · Mint Ice

HEX
#355D5F
RGB
rgb(53, 93, 95)
HSL
hsl(183, 28%, 29%)
HSB
hsb(183, 44%, 37%)
CMYK
cmyk(44%, 2%, 0%, 63%)
Oklch
oklch(45.0% 0.045 199.8)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#04070E

Indigo · Black · Deep Sea Blue

HEX
#04070E
RGB
rgb(4, 7, 14)
HSL
hsl(222, 56%, 4%)
HSB
hsb(222, 71%, 5%)
CMYK
cmyk(71%, 50%, 0%, 95%)
Oklch
oklch(12.8% 0.018 260.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4DBBD
BED6F4

Analogous

F4C0BE
F4DBBD
F1F4BE

Triadic

F4DBBD
BEF4DB
DBBEF4

Split-Comp.

F4DBBD
BEF1F4
C0BEF4

Tetradic

F4DBBD
BEF4C0
BED6F4
F4BEF1

Contrast Matrix WCAG 2.1 Contrast

F4DBBD
ACC7B6
6CA59F
355D5F
04070E
—
1.4
Fail
2.1
Fail
5.5
AA
15.1
AAA
1.4
Fail
—
1.5
Fail
4.0
AA Large
11.1
AAA
2.1
Fail
1.5
Fail
—
2.6
Fail
7.2
AAA
5.5
AA
4.0
AA Large
2.6
Fail
—
2.8
Fail
15.1
AAA
11.1
AAA
7.2
AAA
2.8
Fail
—
White BG
1.3Fail
1.8Fail
2.8Fail
7.3AAA
20.2AAA
Black BG
15.7AAA
11.6AAA
7.5AAA
2.9Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9C4
B8B8BA
8585A0
46475F
05050C

Deuteranopia

EBEDC6
B6B4BB
817DA1
44415E
05050C

Tritanopia

F3CACB
ADBDBE
6FA2A2
375E5E
040B0B

Achromatopsia

DFDFDF
BDBDBD
939393
515151
070707

Shades & Tints Shades & Tints

#F4DBBD

Dark
Light

#ACC7B6

Dark
Light

#6CA59F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4dbbd;
  --color-2: #acc7b6;
  --color-3: #6ca59f;
  --color-4: #355d5f;
  --color-5: #04070e;
}

SCSS

$color-1: #f4dbbd;
$color-2: #acc7b6;
$color-3: #6ca59f;
$color-4: #355d5f;
$color-5: #04070e;

TAILWIND

colors: {
  'brand-1': '#f4dbbd',
  'brand-2': '#acc7b6',
  'brand-3': '#6ca59f',
  'brand-4': '#355d5f',
  'brand-5': '#04070e',
}

RGB Array

[244, 219, 189], [172, 199, 182], [108, 165, 159], [53, 93, 95], [4, 7, 14]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4DBBD, #ACC7B6, #6CA59F, #355D5F, #04070E 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: #f4dbbd; --color-2: #acc7b6; --color-3: #6ca59f; --color-4: #355d5f; --color-5: #04070e. 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 general-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