← Back to Editor

#F8D4B6 · #E1D2BC · #BFC7A7 · #8BA691 · #468673

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#F8D4B6

Apricot · Wheat · Peach Orange

HEX
#F8D4B6
RGB
rgb(248, 212, 182)
HSL
hsl(27, 83%, 84%)
HSB
hsb(27, 27%, 97%)
CMYK
cmyk(0%, 15%, 27%, 3%)
Oklch
oklch(89.3% 0.057 61.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E1D2BC

Goose Yellow · Wheat · Peach Orange

HEX
#E1D2BC
RGB
rgb(225, 210, 188)
HSL
hsl(36, 38%, 81%)
HSB
hsb(36, 16%, 88%)
CMYK
cmyk(0%, 7%, 16%, 12%)
Oklch
oklch(87.0% 0.034 77.6)

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

#BFC7A7

Willow Green · Silver · Apple Green

HEX
#BFC7A7
RGB
rgb(191, 199, 167)
HSL
hsl(75, 22%, 72%)
HSB
hsb(75, 16%, 78%)
CMYK
cmyk(4%, 0%, 16%, 22%)
Oklch
oklch(81.5% 0.044 118.8)

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

#8BA691

Celadon · DarkSeaGreen · Olive Green

HEX
#8BA691
RGB
rgb(139, 166, 145)
HSL
hsl(133, 13%, 60%)
HSB
hsb(133, 16%, 65%)
CMYK
cmyk(16%, 0%, 13%, 35%)
Oklch
oklch(69.8% 0.043 151.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#468673

Mineral Blue · SeaGreen · Mint Ice

HEX
#468673
RGB
rgb(70, 134, 115)
HSL
hsl(162, 31%, 40%)
HSB
hsb(162, 48%, 53%)
CMYK
cmyk(48%, 0%, 14%, 47%)
Oklch
oklch(57.2% 0.073 172.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8D4B6
B4DAF8

Analogous

F8B4B8
F8D4B6
F8F5B4

Triadic

F8D4B6
B4F8D3
D3B4F8

Split-Comp.

F8D4B6
B4F8F5
B4B8F8

Tetradic

F8D4B6
B8F8B4
B4DAF8
F5B4F8

Contrast Matrix WCAG 2.1 Contrast

F8D4B6
E1D2BC
BFC7A7
8BA691
468673
—
1.1
Fail
1.3
Fail
1.9
Fail
3.1
AA Large
1.1
Fail
—
1.2
Fail
1.8
Fail
2.9
Fail
1.3
Fail
1.2
Fail
—
1.5
Fail
2.4
Fail
1.9
Fail
1.8
Fail
1.5
Fail
—
1.6
Fail
3.1
AA Large
2.9
Fail
2.4
Fail
1.6
Fail
—
White BG
1.4Fail
1.5Fail
1.8Fail
2.6Fail
4.3AA Large
Black BG
15.1AAA
14.1AAA
11.9AAA
8.0AAA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8BD
DBDAC1
C2C3AF
979796
626278

Deuteranopia

EBEDBF
DBDDC3
C2C1B1
959397
5E5979

Tritanopia

F6C3C4
E0C6C6
BFB5B6
8C9A9B
497B7C

Achromatopsia

DBDBDB
D4D4D4
C1C1C1
9C9C9C
717171

Shades & Tints Shades & Tints

#F8D4B6

Dark
Light

#E1D2BC

Dark
Light

#BFC7A7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8d4b6;
  --color-2: #e1d2bc;
  --color-3: #bfc7a7;
  --color-4: #8ba691;
  --color-5: #468673;
}

SCSS

$color-1: #f8d4b6;
$color-2: #e1d2bc;
$color-3: #bfc7a7;
$color-4: #8ba691;
$color-5: #468673;

TAILWIND

colors: {
  'brand-1': '#f8d4b6',
  'brand-2': '#e1d2bc',
  'brand-3': '#bfc7a7',
  'brand-4': '#8ba691',
  'brand-5': '#468673',
}

RGB Array

[248, 212, 182], [225, 210, 188], [191, 199, 167], [139, 166, 145], [70, 134, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F8D4B6, #E1D2BC, #BFC7A7, #8BA691, #468673 is ideal for: health products, baby brands, fresh-style blogs, 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: #f8d4b6; --color-2: #e1d2bc; --color-3: #bfc7a7; --color-4: #8ba691; --color-5: #468673. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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