← Back to Editor

#D96481 · #DB7F12 · #1D6A72 · #044774 · #090B1A

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

#D96481

Peach Pink · LightCoral · Coral Red

HEX
#D96481
RGB
rgb(217, 100, 129)
HSL
hsl(345, 61%, 62%)
HSB
hsb(345, 54%, 85%)
CMYK
cmyk(0%, 54%, 41%, 15%)
Oklch
oklch(65.3% 0.149 6.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#DB7F12

Ochre · Chocolate · Amber Brown

HEX
#DB7F12
RGB
rgb(219, 127, 18)
HSL
hsl(33, 85%, 46%)
HSB
hsb(33, 92%, 86%)
CMYK
cmyk(0%, 42%, 92%, 14%)
Oklch
oklch(68.2% 0.154 61.3)

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

#1D6A72

Lake Blue · Teal · Mint Ice

HEX
#1D6A72
RGB
rgb(29, 106, 114)
HSL
hsl(186, 59%, 28%)
HSB
hsb(186, 75%, 45%)
CMYK
cmyk(75%, 7%, 0%, 55%)
Oklch
oklch(48.3% 0.073 205.2)

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

#044774

Lake Blue · MidnightBlue · Prussian Blue

HEX
#044774
RGB
rgb(4, 71, 116)
HSL
hsl(204, 93%, 24%)
HSB
hsb(204, 97%, 45%)
CMYK
cmyk(97%, 39%, 0%, 55%)
Oklch
oklch(38.6% 0.097 246.1)

Traditional「Lake Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#090B1A

Indigo · Black · Deep Sea Blue

HEX
#090B1A
RGB
rgb(9, 11, 26)
HSL
hsl(233, 49%, 7%)
HSB
hsb(233, 65%, 10%)
CMYK
cmyk(65%, 58%, 0%, 90%)
Oklch
oklch(15.7% 0.032 276.2)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D96481
63D9BC

Analogous

D963BC
D96481
D98163

Triadic

D96481
81D963
6381D9

Split-Comp.

D96481
63D981
63BCD9

Tetradic

D96481
BCD963
63D9BC
8163D9

Contrast Matrix WCAG 2.1 Contrast

D96481
DB7F12
1D6A72
044774
090B1A
—
1.2
Fail
1.8
Fail
2.8
Fail
5.7
AA
1.2
Fail
—
2.1
Fail
3.3
AA Large
6.6
AA
1.8
Fail
2.1
Fail
—
1.6
Fail
3.1
AA Large
2.8
Fail
3.3
AA Large
1.6
Fail
—
2.0
Fail
5.7
AA
6.6
AA
3.1
AA Large
2.0
Fail
—
White BG
3.4AA Large
3.0Fail
6.3AA
9.7AAA
19.5AAA
Black BG
6.1AA
7.1AAA
3.4AA Large
2.2Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A57A
B3B22C
3E3F70
212269
0A0A16

Deuteranopia

ADB678
B9BF33
3A3470
1D1866
0A0A16

Tritanopia

D37473
D64146
216F6E
07615F
091413

Achromatopsia

8A8A8A
8E8E8E
545454
383838
0C0C0C

Shades & Tints Shades & Tints

#D96481

Dark
Light

#DB7F12

Dark
Light

#1D6A72

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d96481;
  --color-2: #db7f12;
  --color-3: #1d6a72;
  --color-4: #044774;
  --color-5: #090b1a;
}

SCSS

$color-1: #d96481;
$color-2: #db7f12;
$color-3: #1d6a72;
$color-4: #044774;
$color-5: #090b1a;

TAILWIND

colors: {
  'brand-1': '#d96481',
  'brand-2': '#db7f12',
  'brand-3': '#1d6a72',
  'brand-4': '#044774',
  'brand-5': '#090b1a',
}

RGB Array

[217, 100, 129], [219, 127, 18], [29, 106, 114], [4, 71, 116], [9, 11, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D96481, #DB7F12, #1D6A72, #044774, #090B1A 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: #d96481; --color-2: #db7f12; --color-3: #1d6a72; --color-4: #044774; --color-5: #090b1a. 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