← Back to Editor

#FFE4D9 · #F0996E · #856556 · #36271F · #1A1310

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

#FFE4D9

Apricot · Linen · Peach Orange

HEX
#FFE4D9
RGB
rgb(255, 228, 217)
HSL
hsl(17, 100%, 93%)
HSB
hsb(17, 15%, 100%)
CMYK
cmyk(0%, 11%, 15%, 0%)
Oklch
oklch(93.8% 0.033 43.5)

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

#F0996E

Apricot · DarkSalmon · Warm Sun

HEX
#F0996E
RGB
rgb(240, 153, 110)
HSL
hsl(20, 81%, 69%)
HSB
hsb(20, 54%, 94%)
CMYK
cmyk(0%, 36%, 54%, 6%)
Oklch
oklch(76.2% 0.120 46.7)

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

#856556

Tangerine · DimGray · Amber Brown

HEX
#856556
RGB
rgb(133, 101, 86)
HSL
hsl(19, 21%, 43%)
HSB
hsb(19, 35%, 52%)
CMYK
cmyk(0%, 24%, 35%, 48%)
Oklch
oklch(53.5% 0.047 46.3)

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

#36271F

Tangerine · DarkSlateGray · Cinnamon

HEX
#36271F
RGB
rgb(54, 39, 31)
HSL
hsl(21, 27%, 17%)
HSB
hsb(21, 43%, 21%)
CMYK
cmyk(0%, 28%, 43%, 79%)
Oklch
oklch(28.8% 0.027 49.3)

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

#1A1310

Tangerine · Black · Cinnamon

HEX
#1A1310
RGB
rgb(26, 19, 16)
HSL
hsl(18, 24%, 8%)
HSB
hsb(18, 38%, 10%)
CMYK
cmyk(0%, 27%, 38%, 90%)
Oklch
oklch(19.4% 0.013 44.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFE4D9
DBF5FF

Analogous

FFDBE3
FFE4D9
FFF7DB

Triadic

FFE4D9
DBFFE5
E5DBFF

Split-Comp.

FFE4D9
DBFFF7
DBE3FF

Tetradic

FFE4D9
E3FFDB
DBF5FF
F7DBFF

Contrast Matrix WCAG 2.1 Contrast

FFE4D9
F0996E
856556
36271F
1A1310
—
1.8
Fail
4.3
AA Large
11.8
AAA
15.2
AAA
1.8
Fail
—
2.4
Fail
6.5
AA
8.3
AAA
4.3
AA Large
2.4
Fail
—
2.7
Fail
3.5
AA Large
11.8
AAA
6.5
AA
2.7
Fail
—
1.3
Fail
15.2
AAA
8.3
AAA
3.5
AA Large
1.3
Fail
—
White BG
1.2Fail
2.2Fail
5.3AA
14.3AAA
18.3AAA
Black BG
17.4AAA
9.5AAA
4.0AA Large
1.5Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3DC
CACA78
77775A
302F21
171711

Deuteranopia

F5F7DC
CFD67B
797B5B
303221
171811

Tritanopia

FEDEDE
EC8182
835C5D
352223
1A1111

Achromatopsia

EBEBEB
AEAEAE
6D6D6D
2B2B2B
151515

Shades & Tints Shades & Tints

#FFE4D9

Dark
Light

#F0996E

Dark
Light

#856556

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffe4d9;
  --color-2: #f0996e;
  --color-3: #856556;
  --color-4: #36271f;
  --color-5: #1a1310;
}

SCSS

$color-1: #ffe4d9;
$color-2: #f0996e;
$color-3: #856556;
$color-4: #36271f;
$color-5: #1a1310;

TAILWIND

colors: {
  'brand-1': '#ffe4d9',
  'brand-2': '#f0996e',
  'brand-3': '#856556',
  'brand-4': '#36271f',
  'brand-5': '#1a1310',
}

RGB Array

[255, 228, 217], [240, 153, 110], [133, 101, 86], [54, 39, 31], [26, 19, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFE4D9, #F0996E, #856556, #36271F, #1A1310 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: #ffe4d9; --color-2: #f0996e; --color-3: #856556; --color-4: #36271f; --color-5: #1a1310. 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