← Back to Editor

#FFFB76 · #FFE91F · #01232D · #5E3822 · #70452F

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FFFB76

Fresh Green · Khaki · Sunflower

HEX
#FFFB76
RGB
rgb(255, 251, 118)
HSL
hsl(58, 100%, 73%)
HSB
hsb(58, 54%, 100%)
CMYK
cmyk(0%, 2%, 54%, 0%)
Oklch
oklch(96.6% 0.154 107.4)

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

#FFE91F

Autumn Sage · Gold · Sunflower

HEX
#FFE91F
RGB
rgb(255, 233, 31)
HSL
hsl(54, 100%, 56%)
HSB
hsb(54, 88%, 100%)
CMYK
cmyk(0%, 9%, 88%, 0%)
Oklch
oklch(92.3% 0.189 102.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#01232D

Lake Blue · Black · Peacock Green

HEX
#01232D
RGB
rgb(1, 35, 45)
HSL
hsl(194, 96%, 9%)
HSB
hsb(194, 98%, 18%)
CMYK
cmyk(98%, 22%, 0%, 82%)
Oklch
oklch(23.8% 0.043 221.6)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#5E3822

Tangerine · DarkOliveGreen · Cinnamon

HEX
#5E3822
RGB
rgb(94, 56, 34)
HSL
hsl(22, 47%, 25%)
HSB
hsb(22, 64%, 37%)
CMYK
cmyk(0%, 40%, 64%, 63%)
Oklch
oklch(38.2% 0.064 50.0)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#70452F

Tangerine · DarkOliveGreen · Amber Brown

HEX
#70452F
RGB
rgb(112, 69, 47)
HSL
hsl(20, 41%, 31%)
HSB
hsb(20, 58%, 44%)
CMYK
cmyk(0%, 38%, 58%, 56%)
Oklch
oklch(43.5% 0.068 47.5)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFB76
757AFF

Analogous

FFB675
FFFB76
BFFF75

Triadic

FFFB76
75FFFA
FA75FF

Split-Comp.

FFFB76
75BFFF
B675FF

Tetradic

FFFB76
75FFB6
757AFF
FF75BF

Contrast Matrix WCAG 2.1 Contrast

FFFB76
FFE91F
01232D
5E3822
70452F
—
1.1
Fail
15.1
AAA
9.4
AAA
7.5
AAA
1.1
Fail
—
13.2
AAA
8.2
AAA
6.6
AA
15.1
AAA
13.2
AAA
—
1.6
Fail
2.0
Fail
9.4
AAA
8.2
AAA
1.6
Fail
—
1.3
Fail
7.5
AAA
6.6
AA
2.0
Fail
1.3
Fail
—
White BG
1.1Fail
1.2Fail
16.4AAA
10.2AAA
8.1AAA
Black BG
19.3AAA
16.9AAA
1.3Fail
2.1Fail
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FDFD96
F5F550
10102B
4E4D27
5D5D34

Deuteranopia

FEFE9E
F7F85C
0E0B2A
505329
606336

Tritanopia

FFB0B5
FE767F
032928
5C2C2C
6E3939

Achromatopsia

EDEDED
D9D9D9
1A1A1A
414141
4F4F4F

Shades & Tints Shades & Tints

#FFFB76

Dark
Light

#FFE91F

Dark
Light

#01232D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffb76;
  --color-2: #ffe91f;
  --color-3: #01232d;
  --color-4: #5e3822;
  --color-5: #70452f;
}

SCSS

$color-1: #fffb76;
$color-2: #ffe91f;
$color-3: #01232d;
$color-4: #5e3822;
$color-5: #70452f;

TAILWIND

colors: {
  'brand-1': '#fffb76',
  'brand-2': '#ffe91f',
  'brand-3': '#01232d',
  'brand-4': '#5e3822',
  'brand-5': '#70452f',
}

RGB Array

[255, 251, 118], [255, 233, 31], [1, 35, 45], [94, 56, 34], [112, 69, 47]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFB76, #FFE91F, #01232D, #5E3822, #70452F is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fffb76; --color-2: #ffe91f; --color-3: #01232d; --color-4: #5e3822; --color-5: #70452f. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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