← Back to Editor

#4B6892 · #9F9CA3 · #FDC69D · #F4F1C4 · #ECF2E6

sunset

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#4B6892

Indigo · SteelBlue · Navy Blue

HEX
#4B6892
RGB
rgb(75, 104, 146)
HSL
hsl(215, 32%, 43%)
HSB
hsb(215, 49%, 57%)
CMYK
cmyk(49%, 29%, 0%, 43%)
Oklch
oklch(51.3% 0.075 257.6)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#9F9CA3

Ash · DarkGray · Silver Sand

HEX
#9F9CA3
RGB
rgb(159, 156, 163)
HSL
hsl(266, 4%, 63%)
HSB
hsb(266, 4%, 64%)
CMYK
cmyk(2%, 4%, 0%, 36%)
Oklch
oklch(69.7% 0.011 305.3)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#FDC69D

Apricot · Wheat · Peach Orange

HEX
#FDC69D
RGB
rgb(253, 198, 157)
HSL
hsl(26, 96%, 80%)
HSB
hsb(26, 38%, 99%)
CMYK
cmyk(0%, 22%, 38%, 1%)
Oklch
oklch(86.6% 0.083 58.1)

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

#F4F1C4

Fresh Green · Bisque · Lemon Cream

HEX
#F4F1C4
RGB
rgb(244, 241, 196)
HSL
hsl(56, 69%, 86%)
HSB
hsb(56, 20%, 96%)
CMYK
cmyk(0%, 1%, 20%, 4%)
Oklch
oklch(94.9% 0.058 104.3)

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

#ECF2E6

Celadon · Beige · Mint Green

HEX
#ECF2E6
RGB
rgb(236, 242, 230)
HSL
hsl(90, 32%, 93%)
HSB
hsb(90, 5%, 95%)
CMYK
cmyk(2%, 0%, 5%, 5%)
Oklch
oklch(95.3% 0.017 128.7)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B6892
91734B

Analogous

4B8B91
4B6892
504B91

Triadic

4B6892
914B68
68914B

Split-Comp.

4B6892
91504B
8B914B

Tetradic

4B6892
914B8B
91734B
4B9150

Contrast Matrix WCAG 2.1 Contrast

4B6892
9F9CA3
FDC69D
F4F1C4
ECF2E6
—
2.1
Fail
3.7
AA Large
4.9
AA
5.0
AA
2.1
Fail
—
1.8
Fail
2.3
Fail
2.4
Fail
3.7
AA Large
1.8
Fail
—
1.3
Fail
1.3
Fail
4.9
AA
2.3
Fail
1.3
Fail
—
1.0
Fail
5.0
AA
2.4
Fail
1.3
Fail
1.0
Fail
—
White BG
5.7AA
2.7Fail
1.5Fail
1.2Fail
1.1Fail
Black BG
3.7AA Large
7.8AAA
13.7AAA
18.2AAA
18.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

585888
9E9EA1
E5E5A7
F3F3CF
EFEFE9

Deuteranopia

565485
9E9EA1
E8EDA9
F3F3D2
EEEEEA

Tritanopia

4C807E
9FA0A0
FAAFB0
F4D7D9
ECEBEC

Achromatopsia

646464
9E9E9E
D2D2D2
EDEDED
EFEFEF

Shades & Tints Shades & Tints

#4B6892

Dark
Light

#9F9CA3

Dark
Light

#FDC69D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b6892;
  --color-2: #9f9ca3;
  --color-3: #fdc69d;
  --color-4: #f4f1c4;
  --color-5: #ecf2e6;
}

SCSS

$color-1: #4b6892;
$color-2: #9f9ca3;
$color-3: #fdc69d;
$color-4: #f4f1c4;
$color-5: #ecf2e6;

TAILWIND

colors: {
  'brand-1': '#4b6892',
  'brand-2': '#9f9ca3',
  'brand-3': '#fdc69d',
  'brand-4': '#f4f1c4',
  'brand-5': '#ecf2e6',
}

RGB Array

[75, 104, 146], [159, 156, 163], [253, 198, 157], [244, 241, 196], [236, 242, 230]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #4B6892, #9F9CA3, #FDC69D, #F4F1C4, #ECF2E6 is ideal for: health products, baby brands, fresh-style blogs, 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: #4b6892; --color-2: #9f9ca3; --color-3: #fdc69d; --color-4: #f4f1c4; --color-5: #ecf2e6. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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