← Back to Editor

#F9BA90 · #F74A4A · #240404 · #A19789 · #B5A18F

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

#F9BA90

Apricot · BurlyWood · Peach Orange

HEX
#F9BA90
RGB
rgb(249, 186, 144)
HSL
hsl(24, 90%, 77%)
HSB
hsb(24, 42%, 98%)
CMYK
cmyk(0%, 25%, 42%, 2%)
Oklch
oklch(83.7% 0.092 54.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F74A4A

Peach Pink · Tomato · Coral Red

HEX
#F74A4A
RGB
rgb(247, 74, 74)
HSL
hsl(0, 92%, 63%)
HSB
hsb(0, 70%, 97%)
CMYK
cmyk(0%, 70%, 70%, 3%)
Oklch
oklch(65.7% 0.210 25.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#240404

Vermilion · Black · Deep Berry

HEX
#240404
RGB
rgb(36, 4, 4)
HSL
hsl(0, 80%, 8%)
HSB
hsb(0, 89%, 14%)
CMYK
cmyk(0%, 89%, 89%, 86%)
Oklch
oklch(17.4% 0.057 25.3)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#A19789

Ginger · DarkGray · Warm Sun

HEX
#A19789
RGB
rgb(161, 151, 137)
HSL
hsl(35, 11%, 58%)
HSB
hsb(35, 15%, 63%)
CMYK
cmyk(0%, 6%, 15%, 37%)
Oklch
oklch(68.1% 0.023 76.4)

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

#B5A18F

Apricot · DarkGray · Warm Sun

HEX
#B5A18F
RGB
rgb(181, 161, 143)
HSL
hsl(28, 20%, 64%)
HSB
hsb(28, 21%, 71%)
CMYK
cmyk(0%, 11%, 21%, 29%)
Oklch
oklch(72.1% 0.035 64.2)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9BA90
90CFF9

Analogous

F9909A
F9BA90
F9EF90

Triadic

F9BA90
90F9BA
BA90F9

Split-Comp.

F9BA90
90F9EF
909AF9

Tetradic

F9BA90
9AF990
90CFF9
EF90F9

Contrast Matrix WCAG 2.1 Contrast

F9BA90
F74A4A
240404
A19789
B5A18F
—
2.1
Fail
11.4
AAA
1.7
Fail
1.5
Fail
2.1
Fail
—
5.5
AA
1.2
Fail
1.4
Fail
11.4
AAA
5.5
AA
—
6.7
AA
7.7
AAA
1.7
Fail
1.2
Fail
6.7
AA
—
1.2
Fail
1.5
Fail
1.4
Fail
7.7
AAA
1.2
Fail
—
White BG
1.7Fail
3.5AA Large
19.2AAA
2.9Fail
2.5Fail
Black BG
12.5AAA
6.0AA
1.1Fail
7.3AAA
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDD9A
ACAB4A
161604
9D9D8C
ACAC93

Deuteranopia

E1E69D
B6C34A
181A04
9D9E8D
AEAF94

Tritanopia

F6A2A4
EE4A4A
220404
A18F90
B49798

Achromatopsia

C8C8C8
7E7E7E
0E0E0E
989898
A5A5A5

Shades & Tints Shades & Tints

#F9BA90

Dark
Light

#F74A4A

Dark
Light

#240404

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9ba90;
  --color-2: #f74a4a;
  --color-3: #240404;
  --color-4: #a19789;
  --color-5: #b5a18f;
}

SCSS

$color-1: #f9ba90;
$color-2: #f74a4a;
$color-3: #240404;
$color-4: #a19789;
$color-5: #b5a18f;

TAILWIND

colors: {
  'brand-1': '#f9ba90',
  'brand-2': '#f74a4a',
  'brand-3': '#240404',
  'brand-4': '#a19789',
  'brand-5': '#b5a18f',
}

RGB Array

[249, 186, 144], [247, 74, 74], [36, 4, 4], [161, 151, 137], [181, 161, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F9BA90, #F74A4A, #240404, #A19789, #B5A18F 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: #f9ba90; --color-2: #f74a4a; --color-3: #240404; --color-4: #a19789; --color-5: #b5a18f. 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