← Back to Editor

#F1C8A9 · #EC7441 · #F25334 · #333334 · #547971

sunset

A 5-color sunset 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

#F1C8A9

Apricot · Wheat · Peach Orange

HEX
#F1C8A9
RGB
rgb(241, 200, 169)
HSL
hsl(26, 72%, 80%)
HSB
hsb(26, 30%, 95%)
CMYK
cmyk(0%, 17%, 30%, 5%)
Oklch
oklch(86.1% 0.062 58.9)

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

#EC7441

Tangerine · Tomato · Warm Sun

HEX
#EC7441
RGB
rgb(236, 116, 65)
HSL
hsl(18, 82%, 59%)
HSB
hsb(18, 72%, 93%)
CMYK
cmyk(0%, 51%, 72%, 7%)
Oklch
oklch(69.1% 0.162 42.3)

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

#F25334

Vermilion · Tomato · Passion Red

HEX
#F25334
RGB
rgb(242, 83, 52)
HSL
hsl(10, 88%, 58%)
HSB
hsb(10, 79%, 95%)
CMYK
cmyk(0%, 66%, 79%, 5%)
Oklch
oklch(65.5% 0.200 33.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#333334

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#333334
RGB
rgb(51, 51, 52)
HSL
hsl(240, 1%, 20%)
HSB
hsb(240, 2%, 20%)
CMYK
cmyk(2%, 2%, 0%, 80%)
Oklch
oklch(32.1% 0.002 286.3)

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

#547971

Mineral Blue · DimGray · Mint Ice

HEX
#547971
RGB
rgb(84, 121, 113)
HSL
hsl(167, 18%, 40%)
HSB
hsb(167, 31%, 47%)
CMYK
cmyk(31%, 0%, 7%, 53%)
Oklch
oklch(54.6% 0.044 179.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1C8A9
A7D1F1

Analogous

F1A7AC
F1C8A9
F1ECA7

Triadic

F1C8A9
A7F1C7
C7A7F1

Split-Comp.

F1C8A9
A7F1EC
A7ACF1

Tetradic

F1C8A9
ACF1A7
A7D1F1
ECA7F1

Contrast Matrix WCAG 2.1 Contrast

F1C8A9
EC7441
F25334
333334
547971
—
1.9
Fail
2.2
Fail
8.2
AAA
3.1
AA Large
1.9
Fail
—
1.2
Fail
4.3
AA Large
1.6
Fail
2.2
Fail
1.2
Fail
—
3.6
AA Large
1.4
Fail
8.2
AAA
4.3
AA Large
3.6
AA Large
—
2.6
Fail
3.1
AA Large
1.6
Fail
1.4
Fail
2.6
Fail
—
White BG
1.5Fail
2.9Fail
3.5AA Large
12.6AAA
4.8AA
Black BG
13.6AAA
7.1AAA
6.1AA
1.7Fail
4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFB1
B8B74D
ADAC3C
333334
646473

Deuteranopia

E2E5B2
BFC850
B6C23D
333334
625F73

Tritanopia

EFB6B8
E65759
EA4143
333434
567475

Achromatopsia

D1D1D1
929292
7F7F7F
333333
6D6D6D

Shades & Tints Shades & Tints

#F1C8A9

Dark
Light

#EC7441

Dark
Light

#F25334

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1c8a9;
  --color-2: #ec7441;
  --color-3: #f25334;
  --color-4: #333334;
  --color-5: #547971;
}

SCSS

$color-1: #f1c8a9;
$color-2: #ec7441;
$color-3: #f25334;
$color-4: #333334;
$color-5: #547971;

TAILWIND

colors: {
  'brand-1': '#f1c8a9',
  'brand-2': '#ec7441',
  'brand-3': '#f25334',
  'brand-4': '#333334',
  'brand-5': '#547971',
}

RGB Array

[241, 200, 169], [236, 116, 65], [242, 83, 52], [51, 51, 52], [84, 121, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #F1C8A9, #EC7441, #F25334, #333334, #547971 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: #f1c8a9; --color-2: #ec7441; --color-3: #f25334; --color-4: #333334; --color-5: #547971. 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 sunset-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