#FEF200 + #546B59 + #493E42 + #6F3328 + #FE2E09 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#FEF200

Autumn Sage · Yellow · Honey Gold

HEX

#FEF200

RGB

rgb(254, 242, 0)

HSL

hsl(57, 100%, 50%)

HSB

hsb(57, 100%, 100%)

CMYK

cmyk(0%, 5%, 100%, 0%)

Oklch

oklch(94.0% 0.201 106.0)

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

#546B59

Celadon · DimGray · Forest Green

HEX

#546B59

RGB

rgb(84, 107, 89)

HSL

hsl(133, 12%, 37%)

HSB

hsb(133, 21%, 42%)

CMYK

cmyk(21%, 0%, 17%, 58%)

Oklch

oklch(50.4% 0.039 151.3)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#493E42

Dark Violet · DarkSlateGray · Charcoal

HEX

#493E42

RGB

rgb(73, 62, 66)

HSL

hsl(338, 8%, 26%)

HSB

hsb(338, 15%, 29%)

CMYK

cmyk(0%, 15%, 10%, 71%)

Oklch

oklch(37.7% 0.017 354.0)

Traditional「Dark Violet」· Paint「Charcoal」· Creative Midnight Shadow

#6F3328

Crimson · Brown · Wine Red

HEX

#6F3328

RGB

rgb(111, 51, 40)

HSL

hsl(9, 47%, 30%)

HSB

hsb(9, 64%, 44%)

CMYK

cmyk(0%, 54%, 64%, 56%)

Oklch

oklch(39.9% 0.088 31.9)

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

#FE2E09

Vermilion · OrangeRed · Passion Red

HEX

#FE2E09

RGB

rgb(254, 46, 9)

HSL

hsl(9, 99%, 52%)

HSB

hsb(9, 96%, 100%)

CMYK

cmyk(0%, 82%, 96%, 0%)

Oklch

oklch(64.2% 0.242 31.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FEF200

000DFF

Analogous

FF7300

FEF200

8CFF00

Triadic

FEF200

00FFF2

F200FF

Split-Comp.

FEF200

008CFF

7300FF

Tetradic

FEF200

00FF73

000DFF

FF008C

Contrast Matrix WCAG 2.1 Contrast

FEF200	546B59	493E42	6F3328	FE2E09
—	4.9 AA	8.7 AAA	8.2 AAA	3.2 AA Large
4.9 AA	—	1.8 Fail	1.7 Fail	1.5 Fail
8.7 AAA	1.8 Fail	—	1.1 Fail	2.7 Fail
8.2 AAA	1.7 Fail	1.1 Fail	—	2.6 Fail
3.2 AA Large	1.5 Fail	2.7 Fail	2.6 Fail	—

White BG

1.2Fail

5.8AA

10.2AAA

9.6AAA

3.7AA Large

Black BG

17.9AAA

3.6AA Large

2.1Fail

2.2Fail

5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F9F93B

5E5E5D

444441

55542B

A4A212

Deuteranopia

FAFA49

5D5B5E

454641

595D2B

B0C014

Tritanopia

FD6973

556162

484040

6C2D2D

F4191B

Achromatopsia

DADADA

626262

424242

444444

686868

Shades & Tints Shades & Tints

#FEF200

Dark

Light

#546B59

Dark

Light

#493E42

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fef200;
  --color-2: #546b59;
  --color-3: #493e42;
  --color-4: #6f3328;
  --color-5: #fe2e09;
}

SCSS

$color-1: #fef200;
$color-2: #546b59;
$color-3: #493e42;
$color-4: #6f3328;
$color-5: #fe2e09;

TAILWIND

colors: {
  'brand-1': '#fef200',
  'brand-2': '#546b59',
  'brand-3': '#493e42',
  'brand-4': '#6f3328',
  'brand-5': '#fe2e09',
}

RGB Array

[254, 242, 0], [84, 107, 89], [73, 62, 66], [111, 51, 40], [254, 46, 9]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FEF200, #546B59, #493E42, #6F3328, #FE2E09 is ideal for: tech websites, dark mode UIs, game UIs. 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: #fef200; --color-2: #546b59; --color-3: #493e42; --color-4: #6f3328; --color-5: #fe2e09. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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