← Back to Editor

#392115 · #8F2600 · #489FB3 · #1DC5D0 · #67D1D1

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#392115

Tangerine · Black · Cinnamon

HEX
#392115
RGB
rgb(57, 33, 21)
HSL
hsl(20, 46%, 15%)
HSB
hsb(20, 63%, 22%)
CMYK
cmyk(0%, 42%, 63%, 78%)
Oklch
oklch(27.6% 0.043 47.0)

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

#8F2600

Tangerine · DarkRed · Amber Brown

HEX
#8F2600
RGB
rgb(143, 38, 0)
HSL
hsl(16, 100%, 28%)
HSB
hsb(16, 100%, 56%)
CMYK
cmyk(0%, 73%, 100%, 44%)
Oklch
oklch(43.3% 0.146 36.6)

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

#489FB3

Slate Blue · SteelBlue · Mint Ice

HEX
#489FB3
RGB
rgb(72, 159, 179)
HSL
hsl(191, 43%, 49%)
HSB
hsb(191, 60%, 70%)
CMYK
cmyk(60%, 11%, 0%, 30%)
Oklch
oklch(65.7% 0.088 215.1)

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

#1DC5D0

Lake Blue · DarkTurquoise · Mint Ice

HEX
#1DC5D0
RGB
rgb(29, 197, 208)
HSL
hsl(184, 76%, 46%)
HSB
hsb(184, 86%, 82%)
CMYK
cmyk(86%, 5%, 0%, 18%)
Oklch
oklch(75.1% 0.124 202.2)

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

#67D1D1

Sky Blue · MediumTurquoise · Lake Green

HEX
#67D1D1
RGB
rgb(103, 209, 209)
HSL
hsl(180, 54%, 61%)
HSB
hsb(180, 51%, 82%)
CMYK
cmyk(51%, 0%, 0%, 18%)
Oklch
oklch(79.8% 0.098 195.4)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

392115
152C38

Analogous

38151B
392115
383215

Triadic

392115
153820
201538

Split-Comp.

392115
153832
151B38

Tetradic

392115
1B3815
152C38
321538

Contrast Matrix WCAG 2.1 Contrast

392115
8F2600
489FB3
1DC5D0
67D1D1
—
1.7
Fail
4.9
AA
7.1
AAA
8.3
AAA
1.7
Fail
—
2.8
Fail
4.1
AA Large
4.8
AA
4.9
AA
2.8
Fail
—
1.4
Fail
1.7
Fail
7.1
AAA
4.1
AA Large
1.4
Fail
—
1.2
Fail
8.3
AAA
4.8
AA
1.7
Fail
1.2
Fail
—
White BG
15.0AAA
8.6AAA
3.0AA Large
2.1Fail
1.8Fail
Black BG
1.4Fail
2.4Fail
6.9AA
9.9AAA
11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2F2E18
626109
6E6EAE
6667CD
9596D1

Deuteranopia

303219
68700B
6962AD
5C4FCD
8F87D1

Tritanopia

381A1B
8A1012
4CAAAA
25CBCB
6CD1D1

Achromatopsia

272727
414141
878787
949494
B1B1B1

Shades & Tints Shades & Tints

#392115

Dark
Light

#8F2600

Dark
Light

#489FB3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #392115;
  --color-2: #8f2600;
  --color-3: #489fb3;
  --color-4: #1dc5d0;
  --color-5: #67d1d1;
}

SCSS

$color-1: #392115;
$color-2: #8f2600;
$color-3: #489fb3;
$color-4: #1dc5d0;
$color-5: #67d1d1;

TAILWIND

colors: {
  'brand-1': '#392115',
  'brand-2': '#8f2600',
  'brand-3': '#489fb3',
  'brand-4': '#1dc5d0',
  'brand-5': '#67d1d1',
}

RGB Array

[57, 33, 21], [143, 38, 0], [72, 159, 179], [29, 197, 208], [103, 209, 209]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #392115, #8F2600, #489FB3, #1DC5D0, #67D1D1 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #392115; --color-2: #8f2600; --color-3: #489fb3; --color-4: #1dc5d0; --color-5: #67d1d1. 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 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