← Back to Editor

#BB8F17 · #8A5605 · #185C5D · #093238 · #453722

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#BB8F17

Ochre · DarkGoldenRod · Honey Gold

HEX
#BB8F17
RGB
rgb(187, 143, 23)
HSL
hsl(44, 78%, 41%)
HSB
hsb(44, 88%, 73%)
CMYK
cmyk(0%, 24%, 88%, 27%)
Oklch
oklch(67.4% 0.133 85.5)

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

#8A5605

Ochre · Olive · Amber Brown

HEX
#8A5605
RGB
rgb(138, 86, 5)
HSL
hsl(37, 93%, 28%)
HSB
hsb(37, 96%, 54%)
CMYK
cmyk(0%, 38%, 96%, 46%)
Oklch
oklch(50.0% 0.107 69.0)

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

#185C5D

Lake Blue · DarkSlateGray · Peacock Green

HEX
#185C5D
RGB
rgb(24, 92, 93)
HSL
hsl(181, 59%, 23%)
HSB
hsb(181, 74%, 36%)
CMYK
cmyk(74%, 1%, 0%, 64%)
Oklch
oklch(43.5% 0.065 196.5)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#093238

Lake Blue · DarkSlateGray · Peacock Green

HEX
#093238
RGB
rgb(9, 50, 56)
HSL
hsl(188, 72%, 13%)
HSB
hsb(188, 84%, 22%)
CMYK
cmyk(84%, 11%, 0%, 78%)
Oklch
oklch(29.3% 0.045 209.2)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#453722

Ochre · DarkSlateGray · Cinnamon

HEX
#453722
RGB
rgb(69, 55, 34)
HSL
hsl(36, 34%, 20%)
HSB
hsb(36, 51%, 27%)
CMYK
cmyk(0%, 20%, 51%, 73%)
Oklch
oklch(34.6% 0.039 77.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BB8F17
1742BA

Analogous

BA3D17
BB8F17
94BA17

Triadic

BB8F17
17BA8F
8F17BA

Split-Comp.

BB8F17
1794BA
3D17BA

Tetradic

BB8F17
17BA3D
1742BA
BA1794

Contrast Matrix WCAG 2.1 Contrast

BB8F17
8A5605
185C5D
093238
453722
—
2.1
Fail
2.6
Fail
4.6
AA
3.9
AA Large
2.1
Fail
—
1.3
Fail
2.2
Fail
1.9
Fail
2.6
Fail
1.3
Fail
—
1.8
Fail
1.5
Fail
4.6
AA
2.2
Fail
1.8
Fail
—
1.2
Fail
3.9
AA Large
1.9
Fail
1.5
Fail
1.2
Fail
—
White BG
3.0Fail
6.2AA
7.7AAA
13.8AAA
11.5AAA
Black BG
7.1AAA
3.4AA Large
2.7Fail
1.5Fail
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A834
737319
35365D
1B1B37
3F3F27

Deuteranopia

ABAE3B
777A1D
322C5D
181536
404128

Tritanopia

B94B50
87282B
1B5D5D
0B3535
442B2C

Achromatopsia

8E8E8E
5C5C5C
484848
262626
393939

Shades & Tints Shades & Tints

#BB8F17

Dark
Light

#8A5605

Dark
Light

#185C5D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bb8f17;
  --color-2: #8a5605;
  --color-3: #185c5d;
  --color-4: #093238;
  --color-5: #453722;
}

SCSS

$color-1: #bb8f17;
$color-2: #8a5605;
$color-3: #185c5d;
$color-4: #093238;
$color-5: #453722;

TAILWIND

colors: {
  'brand-1': '#bb8f17',
  'brand-2': '#8a5605',
  'brand-3': '#185c5d',
  'brand-4': '#093238',
  'brand-5': '#453722',
}

RGB Array

[187, 143, 23], [138, 86, 5], [24, 92, 93], [9, 50, 56], [69, 55, 34]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #BB8F17, #8A5605, #185C5D, #093238, #453722 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #bb8f17; --color-2: #8a5605; --color-3: #185c5d; --color-4: #093238; --color-5: #453722. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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