#2B2320 + #375B4F + #6B8560 + #A59965 + #F79903 · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2B2320

Tangerine · Black · Cinnamon

HEX

#2B2320

RGB

rgb(43, 35, 32)

HSL

hsl(16, 15%, 15%)

HSB

hsb(16, 26%, 17%)

CMYK

cmyk(0%, 19%, 26%, 83%)

Oklch

oklch(26.4% 0.013 41.6)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#375B4F

Mineral Blue · DarkSlateGray · Mint Ice

HEX

#375B4F

RGB

rgb(55, 91, 79)

HSL

hsl(160, 25%, 29%)

HSB

hsb(160, 40%, 36%)

CMYK

cmyk(40%, 0%, 13%, 64%)

Oklch

oklch(44.0% 0.046 171.0)

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

#6B8560

Celadon · DimGray · Olive Green

HEX

#6B8560

RGB

rgb(107, 133, 96)

HSL

hsl(102, 16%, 45%)

HSB

hsb(102, 28%, 52%)

CMYK

cmyk(20%, 0%, 28%, 48%)

Oklch

oklch(58.6% 0.063 136.5)

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

#A59965

Ginger · Gray · Sunflower

HEX

#A59965

RGB

rgb(165, 153, 101)

HSL

hsl(49, 26%, 52%)

HSB

hsb(49, 39%, 65%)

CMYK

cmyk(0%, 7%, 39%, 35%)

Oklch

oklch(68.1% 0.072 96.7)

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

#F79903

Ochre · Orange · Amber Brown

HEX

#F79903

RGB

rgb(247, 153, 3)

HSL

hsl(37, 98%, 49%)

HSB

hsb(37, 99%, 97%)

CMYK

cmyk(0%, 38%, 99%, 3%)

Oklch

oklch(76.2% 0.168 67.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B2320

21292C

Analogous

2C2123

2B2320

2C2921

Triadic

2B2320

212C24

24212C

Split-Comp.

2B2320

212C29

21232C

Tetradic

2B2320

232C21

21292C

29212C

Contrast Matrix WCAG 2.1 Contrast

2B2320	375B4F	6B8560	A59965	F79903
—	2.0 Fail	3.8 AA Large	5.4 AA	7.0 AA
2.0 Fail	—	1.9 Fail	2.6 Fail	3.4 AA Large
3.8 AA Large	1.9 Fail	—	1.4 Fail	1.8 Fail
5.4 AA	2.6 Fail	1.4 Fail	—	1.3 Fail
7.0 AA	3.4 AA Large	1.8 Fail	1.3 Fail	—

White BG

15.4AAA

7.6AAA

4.1AA Large

2.9Fail

2.2Fail

Black BG

1.4Fail

2.8Fail

5.1AA

7.3AAA

9.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

282721

474752

767669

A0A072

CECD27

Deuteranopia

282921

454253

75736B

A1A175

D4DB30

Tritanopia

2B2121

395455

6C7072

A47C7E

F2444A

Achromatopsia

252525

4F4F4F

797979

979797

A4A4A4

Shades & Tints Shades & Tints

#2B2320

Dark

Light

#375B4F

Dark

Light

#6B8560

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b2320;
  --color-2: #375b4f;
  --color-3: #6b8560;
  --color-4: #a59965;
  --color-5: #f79903;
}

SCSS

$color-1: #2b2320;
$color-2: #375b4f;
$color-3: #6b8560;
$color-4: #a59965;
$color-5: #f79903;

TAILWIND

colors: {
  'brand-1': '#2b2320',
  'brand-2': '#375b4f',
  'brand-3': '#6b8560',
  'brand-4': '#a59965',
  'brand-5': '#f79903',
}

RGB Array

[43, 35, 32], [55, 91, 79], [107, 133, 96], [165, 153, 101], [247, 153, 3]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #2B2320, #375B4F, #6B8560, #A59965, #F79903 is ideal for: tech websites, dark mode UIs, game UIs. 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: #2b2320; --color-2: #375b4f; --color-3: #6b8560; --color-4: #a59965; --color-5: #f79903. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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