← Back to Editor

#EBB23F · #B1A166 · #F2E19C · #9AC28E · #41BE92

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 Library

Color Details Color Details

#EBB23F

Ginger · SandyBrown · Sunflower

HEX
#EBB23F
RGB
rgb(235, 178, 63)
HSL
hsl(40, 81%, 58%)
HSB
hsb(40, 73%, 92%)
CMYK
cmyk(0%, 24%, 73%, 8%)
Oklch
oklch(79.7% 0.143 81.2)

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

#B1A166

Ginger · Tan · Sunflower

HEX
#B1A166
RGB
rgb(177, 161, 102)
HSL
hsl(47, 32%, 55%)
HSB
hsb(47, 42%, 69%)
CMYK
cmyk(0%, 9%, 42%, 31%)
Oklch
oklch(70.9% 0.080 94.7)

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

#F2E19C

Goose Yellow · Khaki · Lemon Cream

HEX
#F2E19C
RGB
rgb(242, 225, 156)
HSL
hsl(48, 77%, 78%)
HSB
hsb(48, 36%, 95%)
CMYK
cmyk(0%, 7%, 36%, 5%)
Oklch
oklch(90.8% 0.089 96.0)

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

#9AC28E

Celadon · DarkSeaGreen · Apple Green

HEX
#9AC28E
RGB
rgb(154, 194, 142)
HSL
hsl(106, 30%, 66%)
HSB
hsb(106, 27%, 76%)
CMYK
cmyk(21%, 0%, 27%, 24%)
Oklch
oklch(77.1% 0.084 138.6)

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

#41BE92

Mineral Blue · MediumSeaGreen · Olive Green

HEX
#41BE92
RGB
rgb(65, 190, 146)
HSL
hsl(159, 49%, 50%)
HSB
hsb(159, 66%, 75%)
CMYK
cmyk(66%, 0%, 23%, 25%)
Oklch
oklch(72.1% 0.128 165.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBB23F
3D77EB

Analogous

EB5A3D
EBB23F
CEEB3D

Triadic

EBB23F
3DEBB1
B13DEB

Split-Comp.

EBB23F
3DCEEB
5A3DEB

Tetradic

EBB23F
3DEB5A
3D77EB
EB3DCE

Contrast Matrix WCAG 2.1 Contrast

EBB23F
B1A166
F2E19C
9AC28E
41BE92
—
1.3
Fail
1.5
Fail
1.0
Fail
1.2
Fail
1.3
Fail
—
2.0
Fail
1.3
Fail
1.1
Fail
1.5
Fail
2.0
Fail
—
1.5
Fail
1.8
Fail
1.0
Fail
1.3
Fail
1.5
Fail
—
1.2
Fail
1.2
Fail
1.1
Fail
1.8
Fail
1.2
Fail
—
White BG
1.9Fail
2.6Fail
1.3Fail
2.0Fail
2.3Fail
Black BG
11.0AAA
8.2AAA
16.0AAA
10.5AAA
9.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D25B
AAAA74
EBEAAD
ABAC9B
77789D

Deuteranopia

D6DA62
ABAC78
ECEDB1
A9A69E
70679F

Tritanopia

E87176
B08082
F1BABD
9CA5A7
47A5A7

Achromatopsia

B6B6B6
9F9F9F
DEDEDE
B0B0B0
949494

Shades & Tints Shades & Tints

#EBB23F

Dark
Light

#B1A166

Dark
Light

#F2E19C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebb23f;
  --color-2: #b1a166;
  --color-3: #f2e19c;
  --color-4: #9ac28e;
  --color-5: #41be92;
}

SCSS

$color-1: #ebb23f;
$color-2: #b1a166;
$color-3: #f2e19c;
$color-4: #9ac28e;
$color-5: #41be92;

TAILWIND

colors: {
  'brand-1': '#ebb23f',
  'brand-2': '#b1a166',
  'brand-3': '#f2e19c',
  'brand-4': '#9ac28e',
  'brand-5': '#41be92',
}

RGB Array

[235, 178, 63], [177, 161, 102], [242, 225, 156], [154, 194, 142], [65, 190, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EBB23F, #B1A166, #F2E19C, #9AC28E, #41BE92 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: #ebb23f; --color-2: #b1a166; --color-3: #f2e19c; --color-4: #9ac28e; --color-5: #41be92. 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