← Back to Editor

#A2C390 · #B9B96A · #D0AE43 · #E0A729 · #F79D03

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A2C390

Celadon · DarkSeaGreen · Apple Green

HEX
#A2C390
RGB
rgb(162, 195, 144)
HSL
hsl(99, 30%, 66%)
HSB
hsb(99, 26%, 76%)
CMYK
cmyk(17%, 0%, 26%, 24%)
Oklch
oklch(78.0% 0.079 134.7)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#B9B96A

Autumn Sage · Tan · Sunflower

HEX
#B9B96A
RGB
rgb(185, 185, 106)
HSL
hsl(60, 36%, 57%)
HSB
hsb(60, 43%, 73%)
CMYK
cmyk(0%, 0%, 43%, 27%)
Oklch
oklch(76.8% 0.102 108.6)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

#D0AE43

Ginger · GoldenRod · Sunflower

HEX
#D0AE43
RGB
rgb(208, 174, 67)
HSL
hsl(46, 60%, 54%)
HSB
hsb(46, 68%, 82%)
CMYK
cmyk(0%, 16%, 68%, 18%)
Oklch
oklch(76.1% 0.129 91.2)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#E0A729

Ginger · GoldenRod · Sunflower

HEX
#E0A729
RGB
rgb(224, 167, 41)
HSL
hsl(41, 75%, 52%)
HSB
hsb(41, 82%, 88%)
CMYK
cmyk(0%, 25%, 82%, 12%)
Oklch
oklch(76.2% 0.146 81.7)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#F79D03

Ochre · Orange · Amber Brown

HEX
#F79D03
RGB
rgb(247, 157, 3)
HSL
hsl(38, 98%, 49%)
HSB
hsb(38, 99%, 97%)
CMYK
cmyk(0%, 36%, 99%, 3%)
Oklch
oklch(76.9% 0.167 69.1)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A2C390
B08EC2

Analogous

BBC28E
A2C390
8EC296

Triadic

A2C390
8EA0C2
C28EA0

Split-Comp.

A2C390
968EC2
C28EBB

Tetradic

A2C390
8EBBC2
B08EC2
C2968E

Contrast Matrix WCAG 2.1 Contrast

A2C390
B9B96A
D0AE43
E0A729
F79D03
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.0
Fail
White BG
2.0Fail
2.1Fail
2.1Fail
2.2Fail
2.1Fail
Black BG
10.7AAA
10.2AAA
9.8AAA
9.7AAA
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B19C
B9B97D
C1C15D
C7C747
D0CF28

Deuteranopia

AEAC9F
B9B982
C3C663
CBCF4F
D5DC31

Tritanopia

A4A6A8
B98C90
CE7176
DD6065
F2464C

Achromatopsia

B3B3B3
B0B0B0
ACACAC
AAAAAA
A6A6A6

Shades & Tints Shades & Tints

#A2C390

Dark
Light

#B9B96A

Dark
Light

#D0AE43

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a2c390;
  --color-2: #b9b96a;
  --color-3: #d0ae43;
  --color-4: #e0a729;
  --color-5: #f79d03;
}

SCSS

$color-1: #a2c390;
$color-2: #b9b96a;
$color-3: #d0ae43;
$color-4: #e0a729;
$color-5: #f79d03;

TAILWIND

colors: {
  'brand-1': '#a2c390',
  'brand-2': '#b9b96a',
  'brand-3': '#d0ae43',
  'brand-4': '#e0a729',
  'brand-5': '#f79d03',
}

RGB Array

[162, 195, 144], [185, 185, 106], [208, 174, 67], [224, 167, 41], [247, 157, 3]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A2C390, #B9B96A, #D0AE43, #E0A729, #F79D03 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: #a2c390; --color-2: #b9b96a; --color-3: #d0ae43; --color-4: #e0a729; --color-5: #f79d03. 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