← Back to Editor

#78A8A8 · #F0C030 · #402000 · #BD4646 · #A8C0C0

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

#78A8A8

Slate Blue · CadetBlue · Lake Green

HEX
#78A8A8
RGB
rgb(120, 168, 168)
HSL
hsl(180, 22%, 56%)
HSB
hsb(180, 29%, 66%)
CMYK
cmyk(29%, 0%, 0%, 34%)
Oklch
oklch(69.8% 0.051 196.0)

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

#F0C030

Ginger · GoldenRod · Sunflower

HEX
#F0C030
RGB
rgb(240, 192, 48)
HSL
hsl(45, 86%, 56%)
HSB
hsb(45, 80%, 94%)
CMYK
cmyk(0%, 20%, 80%, 6%)
Oklch
oklch(82.8% 0.157 88.7)

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

#402000

Ochre · Black · Cinnamon

HEX
#402000
RGB
rgb(64, 32, 0)
HSL
hsl(30, 100%, 13%)
HSB
hsb(30, 100%, 25%)
CMYK
cmyk(0%, 50%, 100%, 75%)
Oklch
oklch(28.2% 0.066 60.5)

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

#BD4646

Crimson · Sienna · Passion Red

HEX
#BD4646
RGB
rgb(189, 70, 70)
HSL
hsl(0, 47%, 51%)
HSB
hsb(0, 63%, 74%)
CMYK
cmyk(0%, 63%, 63%, 26%)
Oklch
oklch(55.7% 0.154 23.5)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#A8C0C0

Sky Blue · Silver · Lake Green

HEX
#A8C0C0
RGB
rgb(168, 192, 192)
HSL
hsl(180, 16%, 71%)
HSB
hsb(180, 13%, 75%)
CMYK
cmyk(13%, 0%, 0%, 25%)
Oklch
oklch(79.0% 0.026 196.6)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

78A8A8
A77676

Analogous

76A78F
78A8A8
768FA7

Triadic

78A8A8
A776A7
A7A776

Split-Comp.

78A8A8
A7768F
A78F76

Tetradic

78A8A8
8F76A7
A77676
8FA776

Contrast Matrix WCAG 2.1 Contrast

78A8A8
F0C030
402000
BD4646
A8C0C0
—
1.5
Fail
5.6
AA
1.9
Fail
1.4
Fail
1.5
Fail
—
8.6
AAA
3.0
Fail
1.1
Fail
5.6
AA
8.6
AAA
—
2.9
Fail
7.7
AAA
1.9
Fail
3.0
Fail
2.9
Fail
—
2.7
Fail
1.4
Fail
1.1
Fail
7.7
AAA
2.7
Fail
—
White BG
2.6Fail
1.7Fail
14.7AAA
5.1AA
1.9Fail
Black BG
8.0AAA
12.3AAA
1.4Fail
4.1AA Large
11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8DA8
DBDB53
323208
898846
B2B3C0

Deuteranopia

8A86A8
DEE25B
34360A
909946
B1AFC0

Tritanopia

7AA8A8
EE6E74
3E0E0F
B74646
A9C0C0

Achromatopsia

9A9A9A
BEBEBE
262626
6A6A6A
B9B9B9

Shades & Tints Shades & Tints

#78A8A8

Dark
Light

#F0C030

Dark
Light

#402000

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #78a8a8;
  --color-2: #f0c030;
  --color-3: #402000;
  --color-4: #bd4646;
  --color-5: #a8c0c0;
}

SCSS

$color-1: #78a8a8;
$color-2: #f0c030;
$color-3: #402000;
$color-4: #bd4646;
$color-5: #a8c0c0;

TAILWIND

colors: {
  'brand-1': '#78a8a8',
  'brand-2': '#f0c030',
  'brand-3': '#402000',
  'brand-4': '#bd4646',
  'brand-5': '#a8c0c0',
}

RGB Array

[120, 168, 168], [240, 192, 48], [64, 32, 0], [189, 70, 70], [168, 192, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #78A8A8, #F0C030, #402000, #BD4646, #A8C0C0 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: #78a8a8; --color-2: #f0c030; --color-3: #402000; --color-4: #bd4646; --color-5: #a8c0c0. 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