#252621 + #556574 + #707173 + #928713 + #CC8708 · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#252621

Ink Black · DarkSlateGray · Dark Stone

HEX

#252621

RGB

rgb(37, 38, 33)

HSL

hsl(72, 7%, 14%)

HSB

hsb(72, 13%, 15%)

CMYK

cmyk(3%, 0%, 13%, 85%)

Oklch

oklch(26.6% 0.009 116.2)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

#556574

Slate Blue · DimGray · Prussian Blue

HEX

#556574

RGB

rgb(85, 101, 116)

HSL

hsl(209, 15%, 39%)

HSB

hsb(209, 27%, 45%)

CMYK

cmyk(27%, 13%, 0%, 55%)

Oklch

oklch(49.9% 0.031 246.7)

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

#707173

Ink Gray · DimGray · Warm Gray

HEX

#707173

RGB

rgb(112, 113, 115)

HSL

hsl(220, 1%, 45%)

HSB

hsb(220, 3%, 45%)

CMYK

cmyk(3%, 2%, 0%, 55%)

Oklch

oklch(54.8% 0.003 264.5)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#928713

Autumn Sage · Olive · Honey Gold

HEX

#928713

RGB

rgb(146, 135, 19)

HSL

hsl(55, 77%, 32%)

HSB

hsb(55, 87%, 57%)

CMYK

cmyk(0%, 8%, 87%, 43%)

Oklch

oklch(61.4% 0.124 103.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#CC8708

Ochre · DarkGoldenRod · Amber Brown

HEX

#CC8708

RGB

rgb(204, 135, 8)

HSL

hsl(39, 92%, 42%)

HSB

hsb(39, 96%, 80%)

CMYK

cmyk(0%, 34%, 96%, 20%)

Oklch

oklch(67.7% 0.143 72.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

252621

222126

Analogous

262521

252621

232621

Triadic

252621

212526

262125

Split-Comp.

252621

212326

252126

Tetradic

252621

212625

222126

262123

Contrast Matrix WCAG 2.1 Contrast

252621	556574	707173	928713	CC8708
—	2.5 Fail	3.1 AA Large	4.1 AA Large	5.1 AA
2.5 Fail	—	1.2 Fail	1.6 Fail	2.0 Fail
3.1 AA Large	1.2 Fail	—	1.3 Fail	1.6 Fail
4.1 AA Large	1.6 Fail	1.3 Fail	—	1.2 Fail
5.1 AA	2.0 Fail	1.6 Fail	1.2 Fail	—

White BG

15.2AAA

6.0AA

4.9AA

3.7AA Large

3.0Fail

Black BG

1.4Fail

3.5AA Large

4.3AA Large

5.7AA

7.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

252522

5C5C70

707073

8D8D2F

AEAE27

Deuteranopia

252523

5B5A6F

707072

8E8F36

B2B72E

Tritanopia

252323

566E6D

707272

91454A

C93F44

Achromatopsia

252525

626262

717171

7D7D7D

8D8D8D

Shades & Tints Shades & Tints

#252621

Dark

Light

#556574

Dark

Light

#707173

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #252621;
  --color-2: #556574;
  --color-3: #707173;
  --color-4: #928713;
  --color-5: #cc8708;
}

SCSS

$color-1: #252621;
$color-2: #556574;
$color-3: #707173;
$color-4: #928713;
$color-5: #cc8708;

TAILWIND

colors: {
  'brand-1': '#252621',
  'brand-2': '#556574',
  'brand-3': '#707173',
  'brand-4': '#928713',
  'brand-5': '#cc8708',
}

RGB Array

[37, 38, 33], [85, 101, 116], [112, 113, 115], [146, 135, 19], [204, 135, 8]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #252621, #556574, #707173, #928713, #CC8708 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: #252621; --color-2: #556574; --color-3: #707173; --color-4: #928713; --color-5: #cc8708. 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 warm-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