← Back to Editor

#100A0A · #024357 · #0D616A · #19807C · #249E8F

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 App

Color Details Color Details

#100A0A

Crimson · Black · Deep Berry

HEX
#100A0A
RGB
rgb(16, 10, 10)
HSL
hsl(0, 23%, 5%)
HSB
hsb(0, 38%, 6%)
CMYK
cmyk(0%, 38%, 38%, 94%)
Oklch
oklch(15.3% 0.011 18.4)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#024357

Lake Blue · DarkSlateGray · Peacock Green

HEX
#024357
RGB
rgb(2, 67, 87)
HSL
hsl(194, 96%, 17%)
HSB
hsb(194, 98%, 34%)
CMYK
cmyk(98%, 23%, 0%, 66%)
Oklch
oklch(35.7% 0.067 226.0)

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

#0D616A

Lake Blue · Teal · Peacock Green

HEX
#0D616A
RGB
rgb(13, 97, 106)
HSL
hsl(186, 78%, 23%)
HSB
hsb(186, 88%, 42%)
CMYK
cmyk(88%, 8%, 0%, 58%)
Oklch
oklch(45.2% 0.074 206.4)

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

#19807C

Mineral Blue · Teal · Mint Ice

HEX
#19807C
RGB
rgb(25, 128, 124)
HSL
hsl(178, 67%, 30%)
HSB
hsb(178, 80%, 50%)
CMYK
cmyk(80%, 0%, 3%, 50%)
Oklch
oklch(54.5% 0.088 190.8)

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

#249E8F

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#249E8F
RGB
rgb(36, 158, 143)
HSL
hsl(173, 63%, 38%)
HSB
hsb(173, 77%, 62%)
CMYK
cmyk(77%, 0%, 9%, 38%)
Oklch
oklch(63.2% 0.104 182.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

100A0A
0A1010

Analogous

100A0D
100A0A
100D0A

Triadic

100A0A
0A100A
0A0A10

Split-Comp.

100A0A
0A100D
0A0D10

Tetradic

100A0A
0D100A
0A1010
0D0A10

Contrast Matrix WCAG 2.1 Contrast

100A0A
024357
0D616A
19807C
249E8F
—
1.8
Fail
2.7
Fail
4.1
AA Large
5.9
AA
1.8
Fail
—
1.5
Fail
2.3
Fail
3.3
AA Large
2.7
Fail
1.5
Fail
—
1.5
Fail
2.2
Fail
4.1
AA Large
2.3
Fail
1.5
Fail
—
1.4
Fail
5.9
AA
3.3
AA Large
2.2
Fail
1.4
Fail
—
White BG
19.6AAA
10.8AAA
7.2AAA
4.8AA
3.3AA Large
Black BG
1.1Fail
1.9Fail
2.9Fail
4.4AA Large
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0D0D0A
1E1F52
313268
46477D
595A93

Deuteranopia

0E0E0A
1A1551
2D2667
40387D
524994

Tritanopia

100A0A
054E4E
116666
1E7E7E
2A9596

Achromatopsia

0C0C0C
323232
494949
616161
787878

Shades & Tints Shades & Tints

#100A0A

Dark
Light

#024357

Dark
Light

#0D616A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #100a0a;
  --color-2: #024357;
  --color-3: #0d616a;
  --color-4: #19807c;
  --color-5: #249e8f;
}

SCSS

$color-1: #100a0a;
$color-2: #024357;
$color-3: #0d616a;
$color-4: #19807c;
$color-5: #249e8f;

TAILWIND

colors: {
  'brand-1': '#100a0a',
  'brand-2': '#024357',
  'brand-3': '#0d616a',
  'brand-4': '#19807c',
  'brand-5': '#249e8f',
}

RGB Array

[16, 10, 10], [2, 67, 87], [13, 97, 106], [25, 128, 124], [36, 158, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #100A0A, #024357, #0D616A, #19807C, #249E8F 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: #100a0a; --color-2: #024357; --color-3: #0d616a; --color-4: #19807c; --color-5: #249e8f. 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 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