← Back to Editor

#F3E058 · #E8A939 · #A6AB54 · #4B8375 · #050717

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

#F3E058

Fresh Green · Khaki · Sunflower

HEX
#F3E058
RGB
rgb(243, 224, 88)
HSL
hsl(53, 87%, 65%)
HSB
hsb(53, 64%, 95%)
CMYK
cmyk(0%, 8%, 64%, 5%)
Oklch
oklch(89.8% 0.154 101.3)

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

#E8A939

Ginger · GoldenRod · Warm Sun

HEX
#E8A939
RGB
rgb(232, 169, 57)
HSL
hsl(38, 79%, 57%)
HSB
hsb(38, 75%, 91%)
CMYK
cmyk(0%, 27%, 75%, 9%)
Oklch
oklch(77.6% 0.143 77.6)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#A6AB54

Autumn Sage · DarkSeaGreen · Honey Gold

HEX
#A6AB54
RGB
rgb(166, 171, 84)
HSL
hsl(63, 34%, 50%)
HSB
hsb(63, 51%, 67%)
CMYK
cmyk(3%, 0%, 51%, 33%)
Oklch
oklch(71.9% 0.111 111.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#4B8375

Mineral Blue · DimGray · Mint Ice

HEX
#4B8375
RGB
rgb(75, 131, 117)
HSL
hsl(165, 27%, 40%)
HSB
hsb(165, 43%, 51%)
CMYK
cmyk(43%, 0%, 11%, 49%)
Oklch
oklch(56.7% 0.064 176.0)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#050717

Indigo · Black · Deep Sea Blue

HEX
#050717
RGB
rgb(5, 7, 23)
HSL
hsl(233, 64%, 5%)
HSB
hsb(233, 78%, 9%)
CMYK
cmyk(78%, 70%, 0%, 91%)
Oklch
oklch(13.7% 0.036 273.6)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F3E058
586AF3

Analogous

F39458
F3E058
B8F358

Triadic

F3E058
58F3E1
E158F3

Split-Comp.

F3E058
58B8F3
9458F3

Tetradic

F3E058
58F394
586AF3
F358B8

Contrast Matrix WCAG 2.1 Contrast

F3E058
E8A939
A6AB54
4B8375
050717
—
1.5
Fail
1.8
Fail
3.3
AA Large
14.9
AAA
1.5
Fail
—
1.2
Fail
2.1
Fail
9.7
AAA
1.8
Fail
1.2
Fail
—
1.8
Fail
8.2
AAA
3.3
AA Large
2.1
Fail
1.8
Fail
—
4.6
AA
14.9
AAA
9.7
AAA
8.2
AAA
4.6
AA
—
White BG
1.3Fail
2.1Fail
2.4Fail
4.4AA Large
20.0AAA
Black BG
15.6AAA
10.2AAA
8.6AAA
4.8AA
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEB79
CDCC54
A8A869
636478
060613

Deuteranopia

ECED81
D0D55B
A8A86E
605C79
060612

Tritanopia

F29399
E5696E
A67A7D
4E7B7C
05100F

Achromatopsia

D6D6D6
AFAFAF
A0A0A0
717171
080808

Shades & Tints Shades & Tints

#F3E058

Dark
Light

#E8A939

Dark
Light

#A6AB54

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f3e058;
  --color-2: #e8a939;
  --color-3: #a6ab54;
  --color-4: #4b8375;
  --color-5: #050717;
}

SCSS

$color-1: #f3e058;
$color-2: #e8a939;
$color-3: #a6ab54;
$color-4: #4b8375;
$color-5: #050717;

TAILWIND

colors: {
  'brand-1': '#f3e058',
  'brand-2': '#e8a939',
  'brand-3': '#a6ab54',
  'brand-4': '#4b8375',
  'brand-5': '#050717',
}

RGB Array

[243, 224, 88], [232, 169, 57], [166, 171, 84], [75, 131, 117], [5, 7, 23]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F3E058, #E8A939, #A6AB54, #4B8375, #050717 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: #f3e058; --color-2: #e8a939; --color-3: #a6ab54; --color-4: #4b8375; --color-5: #050717. 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