← Back to Editor

#99ADA8 · #B4B298 · #CEB68B · #DFC077 · #D6D65F

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 Library

Color Details Color Details

#99ADA8

Jade · DarkGray · Lake Green

HEX
#99ADA8
RGB
rgb(153, 173, 168)
HSL
hsl(165, 11%, 64%)
HSB
hsb(165, 12%, 68%)
CMYK
cmyk(12%, 0%, 3%, 32%)
Oklch
oklch(73.1% 0.023 178.9)

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

#B4B298

Fresh Green · DarkGray · Sunflower

HEX
#B4B298
RGB
rgb(180, 178, 152)
HSL
hsl(56, 16%, 65%)
HSB
hsb(56, 16%, 71%)
CMYK
cmyk(0%, 1%, 16%, 29%)
Oklch
oklch(75.8% 0.036 103.6)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#CEB68B

Ginger · Tan · Warm Sun

HEX
#CEB68B
RGB
rgb(206, 182, 139)
HSL
hsl(39, 41%, 68%)
HSB
hsb(39, 33%, 81%)
CMYK
cmyk(0%, 12%, 33%, 19%)
Oklch
oklch(78.6% 0.064 82.0)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#DFC077

Ginger · BurlyWood · Sunflower

HEX
#DFC077
RGB
rgb(223, 192, 119)
HSL
hsl(42, 62%, 67%)
HSB
hsb(42, 47%, 87%)
CMYK
cmyk(0%, 14%, 47%, 13%)
Oklch
oklch(81.9% 0.099 87.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#D6D65F

Fresh Green · BurlyWood · Sunflower

HEX
#D6D65F
RGB
rgb(214, 214, 95)
HSL
hsl(60, 59%, 61%)
HSB
hsb(60, 56%, 84%)
CMYK
cmyk(0%, 0%, 56%, 16%)
Oklch
oklch(85.3% 0.141 109.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

99ADA8
AD999E

Analogous

99AD9E
99ADA8
99A8AD

Triadic

99ADA8
A899AD
ADA899

Split-Comp.

99ADA8
AD99A8
AD9E99

Tetradic

99ADA8
9E99AD
AD999E
A8AD99

Contrast Matrix WCAG 2.1 Contrast

99ADA8
B4B298
CEB68B
DFC077
D6D65F
—
1.1
Fail
1.2
Fail
1.3
Fail
1.5
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.3
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.5
Fail
1.4
Fail
1.3
Fail
1.1
Fail
—
White BG
2.4Fail
2.2Fail
2.0Fail
1.8Fail
1.5Fail
Black BG
8.9AAA
9.8AAA
10.7AAA
11.9AAA
13.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A2A9
B3B39E
C4C395
D2D189
D6D67C

Deuteranopia

A19FAA
B3B3A0
C5C798
D3D68D
D6D683

Tritanopia

9AAAAA
B4A3A4
CD9E9F
DD979A
D69398

Achromatopsia

A6A6A6
B0B0B0
B8B8B8
C1C1C1
C8C8C8

Shades & Tints Shades & Tints

#99ADA8

Dark
Light

#B4B298

Dark
Light

#CEB68B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #99ada8;
  --color-2: #b4b298;
  --color-3: #ceb68b;
  --color-4: #dfc077;
  --color-5: #d6d65f;
}

SCSS

$color-1: #99ada8;
$color-2: #b4b298;
$color-3: #ceb68b;
$color-4: #dfc077;
$color-5: #d6d65f;

TAILWIND

colors: {
  'brand-1': '#99ada8',
  'brand-2': '#b4b298',
  'brand-3': '#ceb68b',
  'brand-4': '#dfc077',
  'brand-5': '#d6d65f',
}

RGB Array

[153, 173, 168], [180, 178, 152], [206, 182, 139], [223, 192, 119], [214, 214, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #99ADA8, #B4B298, #CEB68B, #DFC077, #D6D65F is ideal for: corporate websites, product showcases, portfolios. 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: #99ada8; --color-2: #b4b298; --color-3: #ceb68b; --color-4: #dfc077; --color-5: #d6d65f. 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. 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