← Back to Editor

#F8750C · #F1E3DD · #8D839B · #201A07 · #EAE0DB

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F8750C

Tangerine · Chocolate · Warm Sun

HEX
#F8750C
RGB
rgb(248, 117, 12)
HSL
hsl(27, 94%, 51%)
HSB
hsb(27, 95%, 97%)
CMYK
cmyk(0%, 53%, 95%, 3%)
Oklch
oklch(70.6% 0.186 49.3)

TraditionalTangerine」· PaintWarm Sun」· Creative Blush Sunrise

#F1E3DD

Apricot · Linen · Peach Orange

HEX
#F1E3DD
RGB
rgb(241, 227, 221)
HSL
hsl(18, 42%, 91%)
HSB
hsb(18, 8%, 95%)
CMYK
cmyk(0%, 6%, 8%, 5%)
Oklch
oklch(92.5% 0.017 44.8)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#8D839B

Deep Indigo · LightSlateGray · Violet

HEX
#8D839B
RGB
rgb(141, 131, 155)
HSL
hsl(265, 11%, 56%)
HSB
hsb(265, 15%, 61%)
CMYK
cmyk(9%, 15%, 0%, 39%)
Oklch
oklch(62.7% 0.037 304.2)

TraditionalDeep Indigo」· PaintViolet」· Creative Blush Sunrise

#201A07

Ochre · Black · Amber Gold

HEX
#201A07
RGB
rgb(32, 26, 7)
HSL
hsl(46, 64%, 8%)
HSB
hsb(46, 78%, 13%)
CMYK
cmyk(0%, 19%, 78%, 87%)
Oklch
oklch(22.0% 0.033 92.2)

TraditionalOchre」· PaintAmber Gold」· Creative Blush Sunrise

#EAE0DB

Apricot · Beige · Peach Orange

HEX
#EAE0DB
RGB
rgb(234, 224, 219)
HSL
hsl(20, 26%, 89%)
HSB
hsb(20, 6%, 92%)
CMYK
cmyk(0%, 4%, 6%, 8%)
Oklch
oklch(91.3% 0.013 48.6)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8750C
0D8EF8

Analogous

F80D18
F8750C
F8EC0D

Triadic

F8750C
0DF876
760DF8

Split-Comp.

F8750C
0DF8EC
0D18F8

Tetradic

F8750C
18F80D
0D8EF8
EC0DF8

Contrast Matrix WCAG 2.1 Contrast

F8750C
F1E3DD
8D839B
201A07
EAE0DB
2.2
Fail
1.3
Fail
6.2
AA
2.1
Fail
2.2
Fail
2.9
Fail
13.8
AAA
1.0
Fail
1.3
Fail
2.9
Fail
4.8
AA
2.8
Fail
6.2
AA
13.8
AAA
4.8
AA
13.4
AAA
2.1
Fail
1.0
Fail
2.8
Fail
13.4
AAA
White BG
2.8Fail
1.3Fail
3.6AA Large
17.3AAA
1.3Fail
Black BG
7.5AAA
16.8AAA
5.9AA
1.2Fail
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBE25
EBEBDE
898995
1D1D0C
E6E6DC

Deuteranopia

C7D12C
ECEDDF
898A94
1E1E0D
E6E7DD

Tritanopia

F1393E
F0E0E0
8D9190
200F10
E9DDDD

Achromatopsia

909090
E7E7E7
898989
1A1A1A
E2E2E2

Shades & Tints Shades & Tints

#F8750C

Dark
Light

#F1E3DD

Dark
Light

#8D839B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8750c;
  --color-2: #f1e3dd;
  --color-3: #8d839b;
  --color-4: #201a07;
  --color-5: #eae0db;
}

SCSS

$color-1: #f8750c;
$color-2: #f1e3dd;
$color-3: #8d839b;
$color-4: #201a07;
$color-5: #eae0db;

TAILWIND

colors: {
  'brand-1': '#f8750c',
  'brand-2': '#f1e3dd',
  'brand-3': '#8d839b',
  'brand-4': '#201a07',
  'brand-5': '#eae0db',
}

RGB Array

[248, 117, 12], [241, 227, 221], [141, 131, 155], [32, 26, 7], [234, 224, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #F8750C, #F1E3DD, #8D839B, #201A07, #EAE0DB 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: #f8750c; --color-2: #f1e3dd; --color-3: #8d839b; --color-4: #201a07; --color-5: #eae0db. 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 cool-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