← Back to Editor

#0C0300 · #A8A28A · #ECE6D0 · #F4EED6 · #BEB99C

cool

A 5-color cool palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#0C0300

Tangerine · Black · Cinnamon

HEX
#0C0300
RGB
rgb(12, 3, 0)
HSL
hsl(15, 100%, 2%)
HSB
hsb(15, 100%, 5%)
CMYK
cmyk(0%, 75%, 100%, 95%)
Oklch
oklch(11.5% 0.028 56.6)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#A8A28A

Ginger · DarkGray · Sunflower

HEX
#A8A28A
RGB
rgb(168, 162, 138)
HSL
hsl(48, 15%, 60%)
HSB
hsb(48, 18%, 66%)
CMYK
cmyk(0%, 4%, 18%, 34%)
Oklch
oklch(71.1% 0.034 95.5)

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

#ECE6D0

Goose Yellow · Beige · Lemon Cream

HEX
#ECE6D0
RGB
rgb(236, 230, 208)
HSL
hsl(47, 42%, 87%)
HSB
hsb(47, 12%, 93%)
CMYK
cmyk(0%, 3%, 12%, 7%)
Oklch
oklch(92.4% 0.030 94.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F4EED6

Goose Yellow · Beige · Lemon Cream

HEX
#F4EED6
RGB
rgb(244, 238, 214)
HSL
hsl(48, 58%, 90%)
HSB
hsb(48, 12%, 96%)
CMYK
cmyk(0%, 2%, 12%, 4%)
Oklch
oklch(94.7% 0.032 95.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#BEB99C

Fresh Green · Tan · Sunflower

HEX
#BEB99C
RGB
rgb(190, 185, 156)
HSL
hsl(51, 21%, 68%)
HSB
hsb(51, 18%, 75%)
CMYK
cmyk(0%, 3%, 18%, 25%)
Oklch
oklch(78.2% 0.040 99.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0C0300
00080A

Analogous

0A0003
0C0300
0A0800

Triadic

0C0300
000A03
03000A

Split-Comp.

0C0300
000A08
00030A

Tetradic

0C0300
030A00
00080A
08000A

Contrast Matrix WCAG 2.1 Contrast

0C0300
A8A28A
ECE6D0
F4EED6
BEB99C
—
8.0
AAA
16.3
AAA
17.5
AAA
10.3
AAA
8.0
AAA
—
2.0
Fail
2.2
Fail
1.3
Fail
16.3
AAA
2.0
Fail
—
1.1
Fail
1.6
Fail
17.5
AAA
2.2
Fail
1.1
Fail
—
1.7
Fail
10.3
AAA
1.3
Fail
1.6
Fail
1.7
Fail
—
White BG
20.4AAA
2.6Fail
1.3Fail
1.2Fail
2.0Fail
Black BG
1.0Fail
8.2AAA
16.8AAA
18.0AAA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

080801
A5A590
E9E9D5
F1F1DC
BCBCA3

Deuteranopia

090901
A6A691
EAEAD7
F2F2DD
BCBDA5

Tritanopia

0C0101
A89495
ECDADA
F4E0E1
BEA9AA

Achromatopsia

050505
A1A1A1
E5E5E5
EDEDED
B7B7B7

Shades & Tints Shades & Tints

#0C0300

Dark
Light

#A8A28A

Dark
Light

#ECE6D0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0c0300;
  --color-2: #a8a28a;
  --color-3: #ece6d0;
  --color-4: #f4eed6;
  --color-5: #beb99c;
}

SCSS

$color-1: #0c0300;
$color-2: #a8a28a;
$color-3: #ece6d0;
$color-4: #f4eed6;
$color-5: #beb99c;

TAILWIND

colors: {
  'brand-1': '#0c0300',
  'brand-2': '#a8a28a',
  'brand-3': '#ece6d0',
  'brand-4': '#f4eed6',
  'brand-5': '#beb99c',
}

RGB Array

[12, 3, 0], [168, 162, 138], [236, 230, 208], [244, 238, 214], [190, 185, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #0C0300, #A8A28A, #ECE6D0, #F4EED6, #BEB99C 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: #0c0300; --color-2: #a8a28a; --color-3: #ece6d0; --color-4: #f4eed6; --color-5: #beb99c. 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 cool-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