← Back to Editor

#F2E7D2 · #C8D9C9 · #99C7BA · #80A19A · #718D8E

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

WorkspaceReading

Color Details Color Details

#F2E7D2

Goose Yellow · Beige · Peach Orange

HEX
#F2E7D2
RGB
rgb(242, 231, 210)
HSL
hsl(39, 55%, 89%)
HSB
hsb(39, 13%, 95%)
CMYK
cmyk(0%, 5%, 13%, 5%)
Oklch
oklch(93.1% 0.030 83.6)

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

#C8D9C9

Celadon · LightGray · Mint Green

HEX
#C8D9C9
RGB
rgb(200, 217, 201)
HSL
hsl(124, 18%, 82%)
HSB
hsb(124, 8%, 85%)
CMYK
cmyk(8%, 0%, 7%, 15%)
Oklch
oklch(86.8% 0.028 147.0)

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

#99C7BA

Jade · DarkGray · Lake Green

HEX
#99C7BA
RGB
rgb(153, 199, 186)
HSL
hsl(163, 29%, 69%)
HSB
hsb(163, 23%, 78%)
CMYK
cmyk(23%, 0%, 7%, 22%)
Oklch
oklch(79.3% 0.052 175.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#80A19A

Mineral Blue · LightSlateGray · Lake Green

HEX
#80A19A
RGB
rgb(128, 161, 154)
HSL
hsl(167, 15%, 57%)
HSB
hsb(167, 20%, 63%)
CMYK
cmyk(20%, 0%, 4%, 37%)
Oklch
oklch(68.2% 0.038 180.7)

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

#718D8E

Slate Blue · SlateGray · Mint Ice

HEX
#718D8E
RGB
rgb(113, 141, 142)
HSL
hsl(182, 11%, 50%)
HSB
hsb(182, 20%, 56%)
CMYK
cmyk(20%, 1%, 0%, 44%)
Oklch
oklch(62.2% 0.032 199.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2E7D2
D4DEF2

Analogous

F2D8D4
F2E7D2
EEF2D4

Triadic

F2E7D2
D4F2E8
E8D4F2

Split-Comp.

F2E7D2
D4EEF2
D8D4F2

Tetradic

F2E7D2
D4F2D8
D4DEF2
F2D4EE

Contrast Matrix WCAG 2.1 Contrast

F2E7D2
C8D9C9
99C7BA
80A19A
718D8E
—
1.2
Fail
1.5
Fail
2.3
Fail
2.9
Fail
1.2
Fail
—
1.3
Fail
1.9
Fail
2.4
Fail
1.5
Fail
1.3
Fail
—
1.5
Fail
1.9
Fail
2.3
Fail
1.9
Fail
1.5
Fail
—
1.3
Fail
2.9
Fail
2.4
Fail
1.9
Fail
1.3
Fail
—
White BG
1.2Fail
1.5Fail
1.9Fail
2.8Fail
3.6AA Large
Black BG
17.1AAA
14.2AAA
11.2AAA
7.5AAA
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDD7
CFD0CD
ADADBD
8E8F9C
7D7D8E

Deuteranopia

EEEFD8
CECDCE
AAA7BE
8C8A9C
7C798E

Tritanopia

F1DBDC
C9D0D1
9BC0C0
829D9D
728E8E

Achromatopsia

E8E8E8
D2D2D2
B8B8B8
969696
858585

Shades & Tints Shades & Tints

#F2E7D2

Dark
Light

#C8D9C9

Dark
Light

#99C7BA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2e7d2;
  --color-2: #c8d9c9;
  --color-3: #99c7ba;
  --color-4: #80a19a;
  --color-5: #718d8e;
}

SCSS

$color-1: #f2e7d2;
$color-2: #c8d9c9;
$color-3: #99c7ba;
$color-4: #80a19a;
$color-5: #718d8e;

TAILWIND

colors: {
  'brand-1': '#f2e7d2',
  'brand-2': '#c8d9c9',
  'brand-3': '#99c7ba',
  'brand-4': '#80a19a',
  'brand-5': '#718d8e',
}

RGB Array

[242, 231, 210], [200, 217, 201], [153, 199, 186], [128, 161, 154], [113, 141, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F2E7D2, #C8D9C9, #99C7BA, #80A19A, #718D8E is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f2e7d2; --color-2: #c8d9c9; --color-3: #99c7ba; --color-4: #80a19a; --color-5: #718d8e. 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. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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