← Back to Editor

#C9B988 · #999065 · #618569 · #0B4D41 · #003032

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

#C9B988

Ginger · Tan · Sunflower

HEX
#C9B988
RGB
rgb(201, 185, 136)
HSL
hsl(45, 38%, 66%)
HSB
hsb(45, 32%, 79%)
CMYK
cmyk(0%, 8%, 32%, 21%)
Oklch
oklch(78.7% 0.068 92.1)

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

#999065

Autumn Sage · Gray · Honey Gold

HEX
#999065
RGB
rgb(153, 144, 101)
HSL
hsl(50, 20%, 50%)
HSB
hsb(50, 34%, 60%)
CMYK
cmyk(0%, 6%, 34%, 40%)
Oklch
oklch(65.0% 0.061 97.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#618569

Celadon · DimGray · Olive Green

HEX
#618569
RGB
rgb(97, 133, 105)
HSL
hsl(133, 16%, 45%)
HSB
hsb(133, 27%, 52%)
CMYK
cmyk(27%, 0%, 21%, 48%)
Oklch
oklch(58.1% 0.059 151.1)

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

#0B4D41

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0B4D41
RGB
rgb(11, 77, 65)
HSL
hsl(169, 75%, 17%)
HSB
hsb(169, 86%, 30%)
CMYK
cmyk(86%, 0%, 16%, 70%)
Oklch
oklch(37.8% 0.066 176.8)

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

#003032

Lake Blue · DarkSlateGray · Peacock Green

HEX
#003032
RGB
rgb(0, 48, 50)
HSL
hsl(182, 100%, 10%)
HSB
hsb(182, 100%, 20%)
CMYK
cmyk(100%, 4%, 0%, 80%)
Oklch
oklch(28.1% 0.048 199.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9B988
8798C9

Analogous

C99887
C9B988
B9C987

Triadic

C9B988
87C9B9
B987C9

Split-Comp.

C9B988
87B9C9
9887C9

Tetradic

C9B988
87C998
8798C9
C987B9

Contrast Matrix WCAG 2.1 Contrast

C9B988
999065
618569
0B4D41
003032
—
1.7
Fail
2.1
Fail
5.0
AA
7.3
AAA
1.7
Fail
—
1.3
Fail
3.0
AA Large
4.4
AA Large
2.1
Fail
1.3
Fail
—
2.4
Fail
3.4
AA Large
5.0
AA
3.0
AA Large
2.4
Fail
—
1.5
Fail
7.3
AAA
4.4
AA Large
3.4
AA Large
1.5
Fail
—
White BG
1.9Fail
3.2AA Large
4.1AA Large
9.8AAA
14.3AAA
Black BG
10.8AAA
6.5AA
5.1AA
2.2Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C294
95956F
717170
282844
151532

Deuteranopia

C3C497
969672
6F6C71
241F45
120E31

Tritanopia

C89D9F
997879
637576
0E4647
023131

Achromatopsia

B8B8B8
8E8E8E
777777
383838
222222

Shades & Tints Shades & Tints

#C9B988

Dark
Light

#999065

Dark
Light

#618569

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9b988;
  --color-2: #999065;
  --color-3: #618569;
  --color-4: #0b4d41;
  --color-5: #003032;
}

SCSS

$color-1: #c9b988;
$color-2: #999065;
$color-3: #618569;
$color-4: #0b4d41;
$color-5: #003032;

TAILWIND

colors: {
  'brand-1': '#c9b988',
  'brand-2': '#999065',
  'brand-3': '#618569',
  'brand-4': '#0b4d41',
  'brand-5': '#003032',
}

RGB Array

[201, 185, 136], [153, 144, 101], [97, 133, 105], [11, 77, 65], [0, 48, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C9B988, #999065, #618569, #0B4D41, #003032 is ideal for: tech websites, dark mode UIs, game UIs, 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: #c9b988; --color-2: #999065; --color-3: #618569; --color-4: #0b4d41; --color-5: #003032. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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