← Back to Editor

#231B15 · #11697D · #8D8A3D · #A8305D · #E5C7A1

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

#231B15

Tangerine · Black · Cinnamon

HEX
#231B15
RGB
rgb(35, 27, 21)
HSL
hsl(26, 25%, 11%)
HSB
hsb(26, 40%, 14%)
CMYK
cmyk(0%, 23%, 40%, 86%)
Oklch
oklch(23.0% 0.017 58.7)

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

#11697D

Lake Blue · Teal · Mint Ice

HEX
#11697D
RGB
rgb(17, 105, 125)
HSL
hsl(191, 76%, 28%)
HSB
hsb(191, 86%, 49%)
CMYK
cmyk(86%, 16%, 0%, 51%)
Oklch
oklch(48.2% 0.082 218.1)

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

#8D8A3D

Autumn Sage · Sienna · Honey Gold

HEX
#8D8A3D
RGB
rgb(141, 138, 61)
HSL
hsl(58, 40%, 40%)
HSB
hsb(58, 57%, 55%)
CMYK
cmyk(0%, 2%, 57%, 45%)
Oklch
oklch(62.0% 0.099 106.9)

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

#A8305D

Dark Violet · Brown · Camellia

HEX
#A8305D
RGB
rgb(168, 48, 93)
HSL
hsl(338, 56%, 42%)
HSB
hsb(338, 71%, 66%)
CMYK
cmyk(0%, 71%, 45%, 34%)
Oklch
oklch(50.3% 0.159 2.0)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#E5C7A1

Goose Yellow · BurlyWood · Peach Orange

HEX
#E5C7A1
RGB
rgb(229, 199, 161)
HSL
hsl(34, 57%, 76%)
HSB
hsb(34, 30%, 90%)
CMYK
cmyk(0%, 13%, 30%, 10%)
Oklch
oklch(84.6% 0.061 73.4)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

231B15
151D23

Analogous

231516
231B15
232215

Triadic

231B15
15231B
1B1523

Split-Comp.

231B15
152322
151623

Tetradic

231B15
162315
151D23
221523

Contrast Matrix WCAG 2.1 Contrast

231B15
11697D
8D8A3D
A8305D
E5C7A1
—
2.7
Fail
4.7
AA
2.6
Fail
10.5
AAA
2.7
Fail
—
1.7
Fail
1.0
Fail
3.9
AA Large
4.7
AA
1.7
Fail
—
1.8
Fail
2.2
Fail
2.6
Fail
1.0
Fail
1.8
Fail
—
4.0
AA Large
10.5
AAA
3.9
AA Large
2.2
Fail
4.0
AA Large
—
White BG
16.9AAA
6.3AA
3.6AA Large
6.5AA
1.6Fail
Black BG
1.2Fail
3.3AA Large
5.8AA
3.2AA Large
13.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

201F16
373878
8C8C50
747352
D8D8AA

Deuteranopia

202117
322B77
8C8C54
7B8450
DADCAC

Tritanopia

231818
157474
8D5E62
A24A48
E3B1B3

Achromatopsia

1D1D1D
515151
828282
595959
CCCCCC

Shades & Tints Shades & Tints

#231B15

Dark
Light

#11697D

Dark
Light

#8D8A3D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #231b15;
  --color-2: #11697d;
  --color-3: #8d8a3d;
  --color-4: #a8305d;
  --color-5: #e5c7a1;
}

SCSS

$color-1: #231b15;
$color-2: #11697d;
$color-3: #8d8a3d;
$color-4: #a8305d;
$color-5: #e5c7a1;

TAILWIND

colors: {
  'brand-1': '#231b15',
  'brand-2': '#11697d',
  'brand-3': '#8d8a3d',
  'brand-4': '#a8305d',
  'brand-5': '#e5c7a1',
}

RGB Array

[35, 27, 21], [17, 105, 125], [141, 138, 61], [168, 48, 93], [229, 199, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #231B15, #11697D, #8D8A3D, #A8305D, #E5C7A1 is ideal for: tech websites, dark mode UIs, game UIs, 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: #231b15; --color-2: #11697d; --color-3: #8d8a3d; --color-4: #a8305d; --color-5: #e5c7a1. 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. 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 general-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