#609A84 + #8DB39C + #FFF5B0 + #DAA73C + #D53115 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#609A84

Mineral Blue · CadetBlue · Olive Green

HEX

#609A84

RGB

rgb(96, 154, 132)

HSL

hsl(157, 23%, 49%)

HSB

hsb(157, 38%, 60%)

CMYK

cmyk(38%, 0%, 14%, 40%)

Oklch

oklch(64.0% 0.070 168.1)

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

#8DB39C

Celadon · DarkSeaGreen · Apple Green

HEX

#8DB39C

RGB

rgb(141, 179, 156)

HSL

hsl(144, 20%, 63%)

HSB

hsb(144, 21%, 70%)

CMYK

cmyk(21%, 0%, 13%, 30%)

Oklch

oklch(73.2% 0.053 158.2)

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

#FFF5B0

Fresh Green · Wheat · Lemon Cream

HEX

#FFF5B0

RGB

rgb(255, 245, 176)

HSL

hsl(52, 100%, 85%)

HSB

hsb(52, 31%, 100%)

CMYK

cmyk(0%, 4%, 31%, 0%)

Oklch

oklch(96.2% 0.088 100.9)

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

#DAA73C

Ginger · GoldenRod · Sunflower

HEX

#DAA73C

RGB

rgb(218, 167, 60)

HSL

hsl(41, 68%, 55%)

HSB

hsb(41, 72%, 85%)

CMYK

cmyk(0%, 23%, 72%, 15%)

Oklch

oklch(75.7% 0.134 82.3)

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

#D53115

Vermilion · FireBrick · Passion Red

HEX

#D53115

RGB

rgb(213, 49, 21)

HSL

hsl(9, 82%, 46%)

HSB

hsb(9, 90%, 84%)

CMYK

cmyk(0%, 77%, 90%, 16%)

Oklch

oklch(57.1% 0.204 32.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

609A84

9A6076

Analogous

609A67

609A84

60939A

Triadic

609A84

84609A

9A8460

Split-Comp.

609A84

9A6093

9A6760

Tetradic

609A84

67609A

9A6076

939A60

Contrast Matrix WCAG 2.1 Contrast

609A84	8DB39C	FFF5B0	DAA73C	D53115
—	1.4 Fail	2.9 Fail	1.5 Fail	1.5 Fail
1.4 Fail	—	2.1 Fail	1.1 Fail	2.1 Fail
2.9 Fail	2.1 Fail	—	2.0 Fail	4.4 AA Large
1.5 Fail	1.1 Fail	2.0 Fail	—	2.2 Fail
1.5 Fail	2.1 Fail	4.4 AA Large	2.2 Fail	—

White BG

3.3AA Large

2.3Fail

1.1Fail

2.2Fail

4.9AA

Black BG

6.5AA

9.1AAA

18.9AAA

9.6AAA

4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

797A89

9D9EA2

FBFBC1

C4C356

8E8D1C

Deuteranopia

76718B

9B98A3

FBFCC5

C7CB5C

98A41D

Tritanopia

638E8E

8FA6A7

FFCED1

D76A6F

CD2122

Achromatopsia

868686

A5A5A5

F0F0F0

AAAAAA

5F5F5F

Shades & Tints Shades & Tints

#609A84

Dark

Light

#8DB39C

Dark

Light

#FFF5B0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #609a84;
  --color-2: #8db39c;
  --color-3: #fff5b0;
  --color-4: #daa73c;
  --color-5: #d53115;
}

SCSS

$color-1: #609a84;
$color-2: #8db39c;
$color-3: #fff5b0;
$color-4: #daa73c;
$color-5: #d53115;

TAILWIND

colors: {
  'brand-1': '#609a84',
  'brand-2': '#8db39c',
  'brand-3': '#fff5b0',
  'brand-4': '#daa73c',
  'brand-5': '#d53115',
}

RGB Array

[96, 154, 132], [141, 179, 156], [255, 245, 176], [218, 167, 60], [213, 49, 21]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #609A84, #8DB39C, #FFF5B0, #DAA73C, #D53115 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: #609a84; --color-2: #8db39c; --color-3: #fff5b0; --color-4: #daa73c; --color-5: #d53115. 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