← Back to Editor

#372F1A · #76562D · #B57F43 · #D9A859 · #FFCF73

sunset

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

#372F1A

Ochre · DarkSlateGray · Amber Gold

HEX
#372F1A
RGB
rgb(55, 47, 26)
HSL
hsl(43, 36%, 16%)
HSB
hsb(43, 53%, 22%)
CMYK
cmyk(0%, 15%, 53%, 78%)
Oklch
oklch(30.8% 0.036 89.4)

Traditional「Ochre」· Paint「Amber Gold」· Creative Blush Sunrise

#76562D

Ochre · DarkOliveGreen · Amber Brown

HEX
#76562D
RGB
rgb(118, 86, 45)
HSL
hsl(34, 45%, 32%)
HSB
hsb(34, 62%, 46%)
CMYK
cmyk(0%, 27%, 62%, 54%)
Oklch
oklch(47.8% 0.071 71.5)

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

#B57F43

Ochre · Chocolate · Amber Brown

HEX
#B57F43
RGB
rgb(181, 127, 67)
HSL
hsl(32, 46%, 49%)
HSB
hsb(32, 63%, 71%)
CMYK
cmyk(0%, 30%, 63%, 29%)
Oklch
oklch(63.9% 0.102 67.1)

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

#D9A859

Ginger · SandyBrown · Warm Sun

HEX
#D9A859
RGB
rgb(217, 168, 89)
HSL
hsl(37, 63%, 60%)
HSB
hsb(37, 59%, 85%)
CMYK
cmyk(0%, 23%, 59%, 15%)
Oklch
oklch(76.1% 0.113 77.6)

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

#FFCF73

Goose Yellow · Khaki · Warm Sun

HEX
#FFCF73
RGB
rgb(255, 207, 115)
HSL
hsl(39, 100%, 73%)
HSB
hsb(39, 55%, 100%)
CMYK
cmyk(0%, 19%, 55%, 0%)
Oklch
oklch(87.8% 0.123 82.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

372F1A
1A2237

Analogous

37201A
372F1A
31371A

Triadic

372F1A
1A372F
2F1A37

Split-Comp.

372F1A
1A3137
201A37

Tetradic

372F1A
1A3720
1A2237
371A31

Contrast Matrix WCAG 2.1 Contrast

372F1A
76562D
B57F43
D9A859
FFCF73
—
2.0
Fail
3.8
AA Large
6.1
AA
9.1
AAA
2.0
Fail
—
1.9
Fail
3.1
AA Large
4.6
AA
3.8
AA Large
1.9
Fail
—
1.6
Fail
2.4
Fail
6.1
AA
3.1
AA Large
1.6
Fail
—
1.5
Fail
9.1
AAA
4.6
AA
2.4
Fail
1.5
Fail
—
White BG
13.3AAA
6.7AA
3.5AA Large
2.2Fail
1.5Fail
Black BG
1.6Fail
3.1AA Large
6.1AA
9.7AAA
14.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

34331F
686837
9E9D52
C4C36C
EAEA89

Deuteranopia

343520
6A6C39
A1A555
C7CA71
EDF18F

Tritanopia

372324
743F40
B25D60
D77B7F
FD9B9F

Achromatopsia

2F2F2F
5B5B5B
888888
AEAEAE
D3D3D3

Shades & Tints Shades & Tints

#372F1A

Dark
Light

#76562D

Dark
Light

#B57F43

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #372f1a;
  --color-2: #76562d;
  --color-3: #b57f43;
  --color-4: #d9a859;
  --color-5: #ffcf73;
}

SCSS

$color-1: #372f1a;
$color-2: #76562d;
$color-3: #b57f43;
$color-4: #d9a859;
$color-5: #ffcf73;

TAILWIND

colors: {
  'brand-1': '#372f1a',
  'brand-2': '#76562d',
  'brand-3': '#b57f43',
  'brand-4': '#d9a859',
  'brand-5': '#ffcf73',
}

RGB Array

[55, 47, 26], [118, 86, 45], [181, 127, 67], [217, 168, 89], [255, 207, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #372F1A, #76562D, #B57F43, #D9A859, #FFCF73 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: #372f1a; --color-2: #76562d; --color-3: #b57f43; --color-4: #d9a859; --color-5: #ffcf73. 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