← Back to Editor

#FAE9CD · #ABDDC2 · #2BCBB3 · #689C78 · #77825A

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

#FAE9CD

Goose Yellow · Bisque · Peach Orange

HEX
#FAE9CD
RGB
rgb(250, 233, 205)
HSL
hsl(37, 82%, 89%)
HSB
hsb(37, 18%, 98%)
CMYK
cmyk(0%, 7%, 18%, 2%)
Oklch
oklch(94.0% 0.041 80.3)

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

#ABDDC2

Celadon · Silver · Apple Green

HEX
#ABDDC2
RGB
rgb(171, 221, 194)
HSL
hsl(148, 42%, 77%)
HSB
hsb(148, 23%, 87%)
CMYK
cmyk(23%, 0%, 12%, 13%)
Oklch
oklch(85.5% 0.064 161.1)

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

#2BCBB3

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#2BCBB3
RGB
rgb(43, 203, 179)
HSL
hsl(171, 65%, 48%)
HSB
hsb(171, 79%, 80%)
CMYK
cmyk(79%, 0%, 12%, 20%)
Oklch
oklch(75.8% 0.130 179.6)

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

#689C78

Celadon · Gray · Olive Green

HEX
#689C78
RGB
rgb(104, 156, 120)
HSL
hsl(138, 21%, 51%)
HSB
hsb(138, 33%, 61%)
CMYK
cmyk(33%, 0%, 23%, 39%)
Oklch
oklch(64.6% 0.077 153.6)

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

#77825A

Grass Green · DimGray · Olive Green

HEX
#77825A
RGB
rgb(119, 130, 90)
HSL
hsl(77, 18%, 43%)
HSB
hsb(77, 31%, 51%)
CMYK
cmyk(8%, 0%, 31%, 49%)
Oklch
oklch(58.7% 0.059 120.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAE9CD
CCDEFA

Analogous

FAD1CC
FAE9CD
F5FACC

Triadic

FAE9CD
CCFAE8
E8CCFA

Split-Comp.

FAE9CD
CCF5FA
D1CCFA

Tetradic

FAE9CD
CCFAD1
CCDEFA
FACCF5

Contrast Matrix WCAG 2.1 Contrast

FAE9CD
ABDDC2
2BCBB3
689C78
77825A
—
1.3
Fail
1.7
Fail
2.7
Fail
3.4
AA Large
1.3
Fail
—
1.3
Fail
2.1
Fail
2.7
Fail
1.7
Fail
1.3
Fail
—
1.6
Fail
2.0
Fail
2.7
Fail
2.1
Fail
1.6
Fail
—
1.3
Fail
3.4
AA Large
2.7
Fail
2.0
Fail
1.3
Fail
—
White BG
1.2Fail
1.5Fail
2.0Fail
3.2AA Large
4.1AA Large
Black BG
17.6AAA
13.9AAA
10.3AAA
6.6AA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F2D4
C1C1C9
7072B9
7F7F81
7C7C64

Deuteranopia

F4F5D5
BEBACA
675BBA
7C7883
7B7A66

Tritanopia

F9D9DA
AECECF
33BDBE
6B8889
786B6D

Achromatopsia

EBEBEB
CBCBCB
989898
888888
7A7A7A

Shades & Tints Shades & Tints

#FAE9CD

Dark
Light

#ABDDC2

Dark
Light

#2BCBB3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fae9cd;
  --color-2: #abddc2;
  --color-3: #2bcbb3;
  --color-4: #689c78;
  --color-5: #77825a;
}

SCSS

$color-1: #fae9cd;
$color-2: #abddc2;
$color-3: #2bcbb3;
$color-4: #689c78;
$color-5: #77825a;

TAILWIND

colors: {
  'brand-1': '#fae9cd',
  'brand-2': '#abddc2',
  'brand-3': '#2bcbb3',
  'brand-4': '#689c78',
  'brand-5': '#77825a',
}

RGB Array

[250, 233, 205], [171, 221, 194], [43, 203, 179], [104, 156, 120], [119, 130, 90]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAE9CD, #ABDDC2, #2BCBB3, #689C78, #77825A 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: #fae9cd; --color-2: #abddc2; --color-3: #2bcbb3; --color-4: #689c78; --color-5: #77825a. 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