← Back to Editor

#071B29 · #3694F7 · #8E4BB8 · #A3A393 · #CCABAE

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

#071B29

Lake Blue · Black · Deep Sea Blue

HEX
#071B29
RGB
rgb(7, 27, 41)
HSL
hsl(205, 71%, 9%)
HSB
hsb(205, 83%, 16%)
CMYK
cmyk(83%, 34%, 0%, 84%)
Oklch
oklch(21.3% 0.038 241.7)

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

#3694F7

Azure · DodgerBlue · Navy Blue

HEX
#3694F7
RGB
rgb(54, 148, 247)
HSL
hsl(211, 92%, 59%)
HSB
hsb(211, 78%, 97%)
CMYK
cmyk(78%, 40%, 0%, 3%)
Oklch
oklch(66.1% 0.171 253.0)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#8E4BB8

Dark Plum · DarkOrchid · Violet

HEX
#8E4BB8
RGB
rgb(142, 75, 184)
HSL
hsl(277, 43%, 51%)
HSB
hsb(277, 59%, 72%)
CMYK
cmyk(23%, 59%, 0%, 28%)
Oklch
oklch(54.2% 0.172 310.3)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#A3A393

Fresh Green · DarkGray · Silver Sand

HEX
#A3A393
RGB
rgb(163, 163, 147)
HSL
hsl(60, 8%, 61%)
HSB
hsb(60, 10%, 64%)
CMYK
cmyk(0%, 0%, 10%, 36%)
Oklch
oklch(71.1% 0.023 107.0)

Traditional「Fresh Green」· Paint「Silver Sand」· Creative Urban Concrete

#CCABAE

Peach Pink · Silver · Coral Red

HEX
#CCABAE
RGB
rgb(204, 171, 174)
HSL
hsl(355, 24%, 74%)
HSB
hsb(355, 16%, 80%)
CMYK
cmyk(0%, 16%, 15%, 20%)
Oklch
oklch(77.1% 0.039 11.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

071B29
271407

Analogous

072725
071B29
070927

Triadic

071B29
27071A
1A2707

Split-Comp.

071B29
270709
272507

Tetradic

071B29
250727
271407
092707

Contrast Matrix WCAG 2.1 Contrast

071B29
3694F7
8E4BB8
A3A393
CCABAE
—
5.6
AA
3.2
AA Large
6.9
AA
8.4
AAA
5.6
AA
—
1.8
Fail
1.2
Fail
1.5
Fail
3.2
AA Large
1.8
Fail
—
2.1
Fail
2.6
Fail
6.9
AA
1.2
Fail
2.1
Fail
—
1.2
Fail
8.4
AAA
1.5
Fail
2.6
Fail
1.2
Fail
—
White BG
17.5AAA
3.1AA Large
5.5AA
2.6Fail
2.1Fail
Black BG
1.2Fail
6.7AA
3.8AA Large
8.2AAA
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

101026
5F60DF
71709E
A3A397
BEBDAD

Deuteranopia

0F0D25
5952D9
757A97
A3A398
C0C2AD

Tritanopia

082322
3BCCC8
8B8984
A39A9B
CAADAD

Achromatopsia

171717
838383
6B6B6B
A1A1A1
B5B5B5

Shades & Tints Shades & Tints

#071B29

Dark
Light

#3694F7

Dark
Light

#8E4BB8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #071b29;
  --color-2: #3694f7;
  --color-3: #8e4bb8;
  --color-4: #a3a393;
  --color-5: #ccabae;
}

SCSS

$color-1: #071b29;
$color-2: #3694f7;
$color-3: #8e4bb8;
$color-4: #a3a393;
$color-5: #ccabae;

TAILWIND

colors: {
  'brand-1': '#071b29',
  'brand-2': '#3694f7',
  'brand-3': '#8e4bb8',
  'brand-4': '#a3a393',
  'brand-5': '#ccabae',
}

RGB Array

[7, 27, 41], [54, 148, 247], [142, 75, 184], [163, 163, 147], [204, 171, 174]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #071B29, #3694F7, #8E4BB8, #A3A393, #CCABAE is ideal for: 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: #071b29; --color-2: #3694f7; --color-3: #8e4bb8; --color-4: #a3a393; --color-5: #ccabae. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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