← Back to Editor

#261A15 · #D1BE69 · #508A91 · #077D8C · #2E3B3D

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

#261A15

Tangerine · Black · Cinnamon

HEX
#261A15
RGB
rgb(38, 26, 21)
HSL
hsl(18, 29%, 12%)
HSB
hsb(18, 45%, 15%)
CMYK
cmyk(0%, 32%, 45%, 85%)
Oklch
oklch(23.1% 0.021 43.7)

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

#D1BE69

Ginger · BurlyWood · Sunflower

HEX
#D1BE69
RGB
rgb(209, 190, 105)
HSL
hsl(49, 53%, 62%)
HSB
hsb(49, 50%, 82%)
CMYK
cmyk(0%, 9%, 50%, 18%)
Oklch
oklch(80.0% 0.108 97.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#508A91

Slate Blue · CadetBlue · Mint Ice

HEX
#508A91
RGB
rgb(80, 138, 145)
HSL
hsl(186, 29%, 44%)
HSB
hsb(186, 45%, 57%)
CMYK
cmyk(45%, 5%, 0%, 43%)
Oklch
oklch(59.6% 0.062 205.6)

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

#077D8C

Lake Blue · Teal · Mint Ice

HEX
#077D8C
RGB
rgb(7, 125, 140)
HSL
hsl(187, 90%, 29%)
HSB
hsb(187, 95%, 55%)
CMYK
cmyk(95%, 11%, 0%, 45%)
Oklch
oklch(54.1% 0.092 209.6)

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

#2E3B3D

Slate Blue · DarkSlateGray · Peacock Green

HEX
#2E3B3D
RGB
rgb(46, 59, 61)
HSL
hsl(188, 14%, 21%)
HSB
hsb(188, 25%, 24%)
CMYK
cmyk(25%, 3%, 0%, 76%)
Oklch
oklch(34.1% 0.017 207.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

261A15
162227

Analogous

271619
261A15
272416

Triadic

261A15
16271B
1B1627

Split-Comp.

261A15
162724
161927

Tetradic

261A15
192716
162227
241627

Contrast Matrix WCAG 2.1 Contrast

261A15
D1BE69
508A91
077D8C
2E3B3D
—
9.1
AAA
4.3
AA Large
3.5
AA Large
1.5
Fail
9.1
AAA
—
2.1
Fail
2.6
Fail
6.2
AA
4.3
AA Large
2.1
Fail
—
1.2
Fail
3.0
Fail
3.5
AA Large
2.6
Fail
1.2
Fail
—
2.4
Fail
1.5
Fail
6.2
AA
3.0
Fail
2.4
Fail
—
White BG
16.9AAA
1.9Fail
3.9AA Large
4.9AA
11.6AAA
Black BG
1.2Fail
11.3AAA
5.4AA
4.3AA Large
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

212116
C9C97E
696A8F
3A3B88
34343D

Deuteranopia

222217
CACB83
66618F
332A88
33323C

Tritanopia

251717
D08E91
538E8E
0D8685
2F3C3C

Achromatopsia

1D1D1D
BABABA
797979
5B5B5B
373737

Shades & Tints Shades & Tints

#261A15

Dark
Light

#D1BE69

Dark
Light

#508A91

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #261a15;
  --color-2: #d1be69;
  --color-3: #508a91;
  --color-4: #077d8c;
  --color-5: #2e3b3d;
}

SCSS

$color-1: #261a15;
$color-2: #d1be69;
$color-3: #508a91;
$color-4: #077d8c;
$color-5: #2e3b3d;

TAILWIND

colors: {
  'brand-1': '#261a15',
  'brand-2': '#d1be69',
  'brand-3': '#508a91',
  'brand-4': '#077d8c',
  'brand-5': '#2e3b3d',
}

RGB Array

[38, 26, 21], [209, 190, 105], [80, 138, 145], [7, 125, 140], [46, 59, 61]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #261A15, #D1BE69, #508A91, #077D8C, #2E3B3D 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: #261a15; --color-2: #d1be69; --color-3: #508a91; --color-4: #077d8c; --color-5: #2e3b3d. 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