← Back to Editor

#467B88 · #DEE3C0 · #A7B6A2 · #6F5D7D · #342543

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#467B88

Slate Blue · SlateGray · Mint Ice

HEX
#467B88
RGB
rgb(70, 123, 136)
HSL
hsl(192, 32%, 40%)
HSB
hsb(192, 49%, 53%)
CMYK
cmyk(49%, 10%, 0%, 47%)
Oklch
oklch(55.1% 0.060 215.3)

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

#DEE3C0

Fresh Green · Wheat · Lemon Cream

HEX
#DEE3C0
RGB
rgb(222, 227, 192)
HSL
hsl(69, 38%, 82%)
HSB
hsb(69, 15%, 89%)
CMYK
cmyk(2%, 0%, 15%, 11%)
Oklch
oklch(90.3% 0.047 113.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#A7B6A2

Celadon · DarkGray · Apple Green

HEX
#A7B6A2
RGB
rgb(167, 182, 162)
HSL
hsl(105, 12%, 67%)
HSB
hsb(105, 11%, 71%)
CMYK
cmyk(8%, 0%, 11%, 29%)
Oklch
oklch(75.9% 0.033 137.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#6F5D7D

Dark Plum · DimGray · Violet

HEX
#6F5D7D
RGB
rgb(111, 93, 125)
HSL
hsl(274, 15%, 43%)
HSB
hsb(274, 26%, 49%)
CMYK
cmyk(11%, 26%, 0%, 51%)
Oklch
oklch(50.8% 0.054 310.0)

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

#342543

Dark Plum · DarkSlateGray · Dark Purple

HEX
#342543
RGB
rgb(52, 37, 67)
HSL
hsl(270, 29%, 20%)
HSB
hsb(270, 45%, 26%)
CMYK
cmyk(22%, 45%, 0%, 74%)
Oklch
oklch(29.6% 0.056 306.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

467B88
875245

Analogous

458773
467B88
455987

Triadic

467B88
87457A
7A8745

Split-Comp.

467B88
874559
877345

Tetradic

467B88
734587
875245
598745

Contrast Matrix WCAG 2.1 Contrast

467B88
DEE3C0
A7B6A2
6F5D7D
342543
—
3.6
AA Large
2.2
Fail
1.3
Fail
3.0
Fail
3.6
AA Large
—
1.6
Fail
4.5
AA Large
10.6
AAA
2.2
Fail
1.6
Fail
—
2.8
Fail
6.6
AA
1.3
Fail
4.5
AA Large
2.8
Fail
—
2.4
Fail
3.0
Fail
10.6
AAA
6.6
AA
2.4
Fail
—
White BG
4.7AA
1.3Fail
2.1Fail
5.9AA
14.1AAA
Black BG
4.4AA Large
15.9AAA
9.9AAA
3.5AA Large
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5D5D85
E0E0C8
ADAEA7
676775
2E2D3C

Deuteranopia

5A5684
E0DFCA
ADACA8
686A73
2E303A

Tritanopia

498282
DECFD1
A8ABAC
6E6F6E
333635

Achromatopsia

6D6D6D
DEDEDE
AFAFAF
666666
2D2D2D

Shades & Tints Shades & Tints

#467B88

Dark
Light

#DEE3C0

Dark
Light

#A7B6A2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #467b88;
  --color-2: #dee3c0;
  --color-3: #a7b6a2;
  --color-4: #6f5d7d;
  --color-5: #342543;
}

SCSS

$color-1: #467b88;
$color-2: #dee3c0;
$color-3: #a7b6a2;
$color-4: #6f5d7d;
$color-5: #342543;

TAILWIND

colors: {
  'brand-1': '#467b88',
  'brand-2': '#dee3c0',
  'brand-3': '#a7b6a2',
  'brand-4': '#6f5d7d',
  'brand-5': '#342543',
}

RGB Array

[70, 123, 136], [222, 227, 192], [167, 182, 162], [111, 93, 125], [52, 37, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #467B88, #DEE3C0, #A7B6A2, #6F5D7D, #342543 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #467b88; --color-2: #dee3c0; --color-3: #a7b6a2; --color-4: #6f5d7d; --color-5: #342543. 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. Restrained colors convey professionalism and trust. 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