← Back to Editor

#070B34 · #1D2548 · #3B6360 · #9AAE80 · #D5C256

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

#070B34

Indigo · Black · Deep Sea Blue

HEX
#070B34
RGB
rgb(7, 11, 52)
HSL
hsl(235, 76%, 12%)
HSB
hsb(235, 87%, 20%)
CMYK
cmyk(87%, 79%, 0%, 80%)
Oklch
oklch(18.1% 0.079 271.1)

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

#1D2548

Indigo · MidnightBlue · Deep Sea Blue

HEX
#1D2548
RGB
rgb(29, 37, 72)
HSL
hsl(229, 43%, 20%)
HSB
hsb(229, 60%, 28%)
CMYK
cmyk(60%, 49%, 0%, 72%)
Oklch
oklch(27.7% 0.065 271.8)

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

#3B6360

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#3B6360
RGB
rgb(59, 99, 96)
HSL
hsl(176, 25%, 31%)
HSB
hsb(176, 40%, 39%)
CMYK
cmyk(40%, 0%, 3%, 61%)
Oklch
oklch(46.9% 0.046 189.6)

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

#9AAE80

Grass Green · DarkSeaGreen · Olive Green

HEX
#9AAE80
RGB
rgb(154, 174, 128)
HSL
hsl(86, 22%, 59%)
HSB
hsb(86, 26%, 68%)
CMYK
cmyk(11%, 0%, 26%, 32%)
Oklch
oklch(72.3% 0.068 127.1)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#D5C256

Autumn Sage · SandyBrown · Sunflower

HEX
#D5C256
RGB
rgb(213, 194, 86)
HSL
hsl(51, 60%, 59%)
HSB
hsb(51, 60%, 84%)
CMYK
cmyk(0%, 9%, 60%, 16%)
Oklch
oklch(80.9% 0.130 99.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

070B34
363207

Analogous

072236
070B34
1B0736

Triadic

070B34
36070B
0B3607

Split-Comp.

070B34
361B07
223607

Tetradic

070B34
360722
363207
07361B

Contrast Matrix WCAG 2.1 Contrast

070B34
1D2548
3B6360
9AAE80
D5C256
—
1.3
Fail
2.8
Fail
7.9
AAA
10.6
AAA
1.3
Fail
—
2.2
Fail
6.2
AA
8.3
AAA
2.8
Fail
2.2
Fail
—
2.8
Fail
3.7
AA Large
7.9
AAA
6.2
AA
2.8
Fail
—
1.3
Fail
10.6
AAA
8.3
AAA
3.7
AA Large
1.3
Fail
—
White BG
19.0AAA
14.9AAA
6.7AA
2.4Fail
1.8Fail
Black BG
1.1Fail
1.4Fail
3.1AA Large
8.7AAA
11.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

09092A
202140
4C4D61
A3A38B
CDCD70

Deuteranopia

090828
201F3E
4A4761
A2A08E
CECF76

Tritanopia

072221
1D3937
3D6161
9B9496
D48589

Achromatopsia

0E0E0E
272727
575757
A3A3A3
BBBBBB

Shades & Tints Shades & Tints

#070B34

Dark
Light

#1D2548

Dark
Light

#3B6360

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #070b34;
  --color-2: #1d2548;
  --color-3: #3b6360;
  --color-4: #9aae80;
  --color-5: #d5c256;
}

SCSS

$color-1: #070b34;
$color-2: #1d2548;
$color-3: #3b6360;
$color-4: #9aae80;
$color-5: #d5c256;

TAILWIND

colors: {
  'brand-1': '#070b34',
  'brand-2': '#1d2548',
  'brand-3': '#3b6360',
  'brand-4': '#9aae80',
  'brand-5': '#d5c256',
}

RGB Array

[7, 11, 52], [29, 37, 72], [59, 99, 96], [154, 174, 128], [213, 194, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #070B34, #1D2548, #3B6360, #9AAE80, #D5C256 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: #070b34; --color-2: #1d2548; --color-3: #3b6360; --color-4: #9aae80; --color-5: #d5c256. 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