← Back to Editor

#F2D40F · #F2E79D · #000000 · #F74F16 · #30302D

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 LibraryData Visualization

Color Details Color Details

#F2D40F

Autumn Sage · Gold · Honey Gold

HEX
#F2D40F
RGB
rgb(242, 212, 15)
HSL
hsl(52, 90%, 50%)
HSB
hsb(52, 94%, 95%)
CMYK
cmyk(0%, 12%, 94%, 5%)
Oklch
oklch(86.9% 0.178 98.7)

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

#F2E79D

Fresh Green · Khaki · Lemon Cream

HEX
#F2E79D
RGB
rgb(242, 231, 157)
HSL
hsl(52, 77%, 78%)
HSB
hsb(52, 35%, 95%)
CMYK
cmyk(0%, 5%, 35%, 5%)
Oklch
oklch(92.0% 0.094 100.8)

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

#000000

Ink Black · Black · Jet Black

HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
HSB
hsb(0, 0%, 0%)
CMYK
cmyk(0%, 0%, 0%, 100%)
Oklch
oklch(0.0% 0.000 0.0)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#F74F16

Tangerine · OrangeRed · Warm Sun

HEX
#F74F16
RGB
rgb(247, 79, 22)
HSL
hsl(15, 93%, 53%)
HSB
hsb(15, 91%, 97%)
CMYK
cmyk(0%, 68%, 91%, 3%)
Oklch
oklch(65.7% 0.213 36.5)

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

#30302D

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#30302D
RGB
rgb(48, 48, 45)
HSL
hsl(60, 3%, 18%)
HSB
hsb(60, 6%, 19%)
CMYK
cmyk(0%, 0%, 6%, 81%)
Oklch
oklch(30.8% 0.005 106.7)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2D40F
0D2BF2

Analogous

F2610D
F2D40F
9EF20D

Triadic

F2D40F
0DF2D4
D40DF2

Split-Comp.

F2D40F
0D9EF2
610DF2

Tetradic

F2D40F
0DF261
0D2BF2
F20D9E

Contrast Matrix WCAG 2.1 Contrast

F2D40F
F2E79D
000000
F74F16
30302D
—
1.2
Fail
14.2
AAA
2.3
Fail
9.0
AAA
1.2
Fail
—
16.7
AAA
2.7
Fail
10.5
AAA
14.2
AAA
16.7
AAA
—
6.1
AA
1.6
Fail
2.3
Fail
2.7
Fail
6.1
AA
—
3.8
AA Large
9.0
AAA
10.5
AAA
1.6
Fail
3.8
AA Large
—
White BG
1.5Fail
1.3Fail
21.0AAA
3.5AA Large
13.2AAA
Black BG
14.2AAA
16.7AAA
1.0Fail
6.1AA
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E53F
EDEDAF
000000
AEAD24
30302E

Deuteranopia

E7E94A
EEEFB3
000000
B8C527
30302E

Tritanopia

F0646D
F1BDC0
000000
EF2F31
302E2E

Achromatopsia

C7C7C7
E2E2E2
000000
7B7B7B
303030

Shades & Tints Shades & Tints

#F2D40F

Dark
Light

#F2E79D

Dark
Light

#000000

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2d40f;
  --color-2: #f2e79d;
  --color-3: #000000;
  --color-4: #f74f16;
  --color-5: #30302d;
}

SCSS

$color-1: #f2d40f;
$color-2: #f2e79d;
$color-3: #000000;
$color-4: #f74f16;
$color-5: #30302d;

TAILWIND

colors: {
  'brand-1': '#f2d40f',
  'brand-2': '#f2e79d',
  'brand-3': '#000000',
  'brand-4': '#f74f16',
  'brand-5': '#30302d',
}

RGB Array

[242, 212, 15], [242, 231, 157], [0, 0, 0], [247, 79, 22], [48, 48, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F2D40F, #F2E79D, #000000, #F74F16, #30302D is ideal for: tech websites, dark mode UIs, game UIs, 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: #f2d40f; --color-2: #f2e79d; --color-3: #000000; --color-4: #f74f16; --color-5: #30302d. 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. 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