← Back to Editor

#151826 · #343F6E · #788060 · #B39654 · #F2C761

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

#151826

Indigo · Black · Deep Sea Blue

HEX
#151826
RGB
rgb(21, 24, 38)
HSL
hsl(229, 29%, 12%)
HSB
hsb(229, 45%, 15%)
CMYK
cmyk(45%, 37%, 0%, 85%)
Oklch
oklch(21.3% 0.028 274.5)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#343F6E

Indigo · DarkSlateGray · Prussian Blue

HEX
#343F6E
RGB
rgb(52, 63, 110)
HSL
hsl(229, 36%, 32%)
HSB
hsb(229, 53%, 43%)
CMYK
cmyk(53%, 43%, 0%, 57%)
Oklch
oklch(38.2% 0.081 272.1)

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

#788060

Grass Green · DimGray · Olive Green

HEX
#788060
RGB
rgb(120, 128, 96)
HSL
hsl(75, 14%, 44%)
HSB
hsb(75, 25%, 50%)
CMYK
cmyk(6%, 0%, 25%, 50%)
Oklch
oklch(58.4% 0.048 119.3)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#B39654

Ginger · DarkSalmon · Sunflower

HEX
#B39654
RGB
rgb(179, 150, 84)
HSL
hsl(42, 38%, 52%)
HSB
hsb(42, 53%, 70%)
CMYK
cmyk(0%, 16%, 53%, 30%)
Oklch
oklch(68.5% 0.092 86.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#F2C761

Ginger · SandyBrown · Sunflower

HEX
#F2C761
RGB
rgb(242, 199, 97)
HSL
hsl(42, 85%, 66%)
HSB
hsb(42, 60%, 95%)
CMYK
cmyk(0%, 18%, 60%, 5%)
Oklch
oklch(84.8% 0.129 86.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

151826
272416

Analogous

162227
151826
1B1627

Triadic

151826
271619
192716

Split-Comp.

151826
271B16
222716

Tetradic

151826
271622
272416
16271B

Contrast Matrix WCAG 2.1 Contrast

151826
343F6E
788060
B39654
F2C761
—
1.7
Fail
4.2
AA Large
6.2
AA
11.0
AAA
1.7
Fail
—
2.4
Fail
3.6
AA Large
6.3
AA
4.2
AA Large
2.4
Fail
—
1.5
Fail
2.6
Fail
6.2
AA
3.6
AA Large
1.5
Fail
—
1.8
Fail
11.0
AAA
6.3
AA
2.6
Fail
1.8
Fail
—
White BG
17.6AAA
10.1AAA
4.2AA Large
2.8Fail
1.6Fail
Black BG
1.2Fail
2.1Fail
5.1AA
7.4AAA
13.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

161623
393963
7B7C68
A6A664
DFDF7A

Deuteranopia

161622
383760
7B7A6A
A8AA68
E2E580

Tritanopia

15201F
355A58
786E6F
B27173
F08D91

Achromatopsia

191919
414141
7A7A7A
979797
C8C8C8

Shades & Tints Shades & Tints

#151826

Dark
Light

#343F6E

Dark
Light

#788060

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #151826;
  --color-2: #343f6e;
  --color-3: #788060;
  --color-4: #b39654;
  --color-5: #f2c761;
}

SCSS

$color-1: #151826;
$color-2: #343f6e;
$color-3: #788060;
$color-4: #b39654;
$color-5: #f2c761;

TAILWIND

colors: {
  'brand-1': '#151826',
  'brand-2': '#343f6e',
  'brand-3': '#788060',
  'brand-4': '#b39654',
  'brand-5': '#f2c761',
}

RGB Array

[21, 24, 38], [52, 63, 110], [120, 128, 96], [179, 150, 84], [242, 199, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #151826, #343F6E, #788060, #B39654, #F2C761 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: #151826; --color-2: #343f6e; --color-3: #788060; --color-4: #b39654; --color-5: #f2c761. 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