← Back to Editor

#E09B4C · #C9B267 · #99BA97 · #639180 · #214B5C

bright

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

#E09B4C

Ginger · SandyBrown · Warm Sun

HEX
#E09B4C
RGB
rgb(224, 155, 76)
HSL
hsl(32, 70%, 59%)
HSB
hsb(32, 66%, 88%)
CMYK
cmyk(0%, 31%, 66%, 12%)
Oklch
oklch(74.2% 0.126 67.3)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#C9B267

Ginger · Tan · Sunflower

HEX
#C9B267
RGB
rgb(201, 178, 103)
HSL
hsl(46, 48%, 60%)
HSB
hsb(46, 49%, 79%)
CMYK
cmyk(0%, 11%, 49%, 21%)
Oklch
oklch(76.7% 0.099 92.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#99BA97

Celadon · DarkSeaGreen · Apple Green

HEX
#99BA97
RGB
rgb(153, 186, 151)
HSL
hsl(117, 20%, 66%)
HSB
hsb(117, 19%, 73%)
CMYK
cmyk(18%, 0%, 19%, 27%)
Oklch
oklch(75.5% 0.061 143.5)

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

#639180

Mineral Blue · SlateGray · Olive Green

HEX
#639180
RGB
rgb(99, 145, 128)
HSL
hsl(158, 19%, 48%)
HSB
hsb(158, 32%, 57%)
CMYK
cmyk(32%, 0%, 12%, 43%)
Oklch
oklch(61.8% 0.056 169.4)

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

#214B5C

Slate Blue · DarkSlateGray · Peacock Green

HEX
#214B5C
RGB
rgb(33, 75, 92)
HSL
hsl(197, 47%, 25%)
HSB
hsb(197, 64%, 36%)
CMYK
cmyk(64%, 18%, 0%, 64%)
Oklch
oklch(39.1% 0.055 227.2)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E09B4C
4D92E0

Analogous

E0524D
E09B4C
DBE04D

Triadic

E09B4C
4DE09B
9B4DE0

Split-Comp.

E09B4C
4DDBE0
524DE0

Tetradic

E09B4C
4DE052
4D92E0
E04DDB

Contrast Matrix WCAG 2.1 Contrast

E09B4C
C9B267
99BA97
639180
214B5C
—
1.1
Fail
1.1
Fail
1.5
Fail
4.0
AA Large
1.1
Fail
—
1.0
Fail
1.7
Fail
4.5
AA
1.1
Fail
1.0
Fail
—
1.7
Fail
4.4
AA Large
1.5
Fail
1.7
Fail
1.7
Fail
—
2.6
Fail
4.0
AA Large
4.5
AA
4.4
AA Large
2.6
Fail
—
White BG
2.3Fail
2.1Fail
2.1Fail
3.6AA Large
9.4AAA
Black BG
9.0AAA
10.0AAA
9.8AAA
5.9AA
2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C25F
BFBF79
A7A89F
777784
333458

Deuteranopia

C6CB64
C0C27E
A5A3A2
747185
312E57

Tritanopia

DD6E72
C8878B
9BA6A8
658788
235554

Achromatopsia

A7A7A7
B0B0B0
ACACAC
818181
404040

Shades & Tints Shades & Tints

#E09B4C

Dark
Light

#C9B267

Dark
Light

#99BA97

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e09b4c;
  --color-2: #c9b267;
  --color-3: #99ba97;
  --color-4: #639180;
  --color-5: #214b5c;
}

SCSS

$color-1: #e09b4c;
$color-2: #c9b267;
$color-3: #99ba97;
$color-4: #639180;
$color-5: #214b5c;

TAILWIND

colors: {
  'brand-1': '#e09b4c',
  'brand-2': '#c9b267',
  'brand-3': '#99ba97',
  'brand-4': '#639180',
  'brand-5': '#214b5c',
}

RGB Array

[224, 155, 76], [201, 178, 103], [153, 186, 151], [99, 145, 128], [33, 75, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #E09B4C, #C9B267, #99BA97, #639180, #214B5C 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: #e09b4c; --color-2: #c9b267; --color-3: #99ba97; --color-4: #639180; --color-5: #214b5c. 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 bright-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