← Back to Editor

#6D7790 · #A2CAD2 · #D6E0D5 · #F3F2DE · #FF6F86

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#6D7790

Indigo · SlateGray · Navy Blue

HEX
#6D7790
RGB
rgb(109, 119, 144)
HSL
hsl(223, 14%, 50%)
HSB
hsb(223, 24%, 56%)
CMYK
cmyk(24%, 17%, 0%, 44%)
Oklch
oklch(57.0% 0.040 268.0)

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

#A2CAD2

Sky Blue · LightSteelBlue · Lake Green

HEX
#A2CAD2
RGB
rgb(162, 202, 210)
HSL
hsl(190, 35%, 73%)
HSB
hsb(190, 23%, 82%)
CMYK
cmyk(23%, 4%, 0%, 18%)
Oklch
oklch(81.3% 0.044 211.2)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#D6E0D5

Celadon · LightGray · Mint Green

HEX
#D6E0D5
RGB
rgb(214, 224, 213)
HSL
hsl(115, 15%, 86%)
HSB
hsb(115, 5%, 88%)
CMYK
cmyk(4%, 0%, 5%, 12%)
Oklch
oklch(89.6% 0.018 142.8)

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

#F3F2DE

Fresh Green · Beige · Lemon Cream

HEX
#F3F2DE
RGB
rgb(243, 242, 222)
HSL
hsl(57, 47%, 91%)
HSB
hsb(57, 9%, 95%)
CMYK
cmyk(0%, 0%, 9%, 5%)
Oklch
oklch(95.7% 0.026 104.6)

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

#FF6F86

Peach Pink · LightCoral · Coral Red

HEX
#FF6F86
RGB
rgb(255, 111, 134)
HSL
hsl(350, 100%, 72%)
HSB
hsb(350, 56%, 100%)
CMYK
cmyk(0%, 56%, 47%, 0%)
Oklch
oklch(72.2% 0.176 12.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6D7790
91876E

Analogous

6E8A91
6D7790
756E91

Triadic

6D7790
916E78
78916E

Split-Comp.

6D7790
91756E
8A916E

Tetradic

6D7790
916E8A
91876E
6E9175

Contrast Matrix WCAG 2.1 Contrast

6D7790
A2CAD2
D6E0D5
F3F2DE
FF6F86
—
2.5
Fail
3.3
AA Large
4.0
AA Large
1.7
Fail
2.5
Fail
—
1.3
Fail
1.6
Fail
1.5
Fail
3.3
AA Large
1.3
Fail
—
1.2
Fail
2.0
Fail
4.0
AA Large
1.6
Fail
1.2
Fail
—
2.4
Fail
1.7
Fail
1.5
Fail
2.0
Fail
2.4
Fail
—
White BG
4.5AA Large
1.8Fail
1.4Fail
1.1Fail
2.7Fail
Black BG
4.7AA
11.9AAA
15.5AAA
18.6AAA
7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

71718A
B3B4D0
DADAD8
F3F3E3
C1BF80

Deuteranopia

717089
B1AED0
DAD9D8
F3F3E4
C9D47F

Tritanopia

6E8584
A4CFCE
D6DADA
F3E7E8
F87C7B

Achromatopsia

777777
BFBFBF
DCDCDC
F0F0F0
9D9D9D

Shades & Tints Shades & Tints

#6D7790

Dark
Light

#A2CAD2

Dark
Light

#D6E0D5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6d7790;
  --color-2: #a2cad2;
  --color-3: #d6e0d5;
  --color-4: #f3f2de;
  --color-5: #ff6f86;
}

SCSS

$color-1: #6d7790;
$color-2: #a2cad2;
$color-3: #d6e0d5;
$color-4: #f3f2de;
$color-5: #ff6f86;

TAILWIND

colors: {
  'brand-1': '#6d7790',
  'brand-2': '#a2cad2',
  'brand-3': '#d6e0d5',
  'brand-4': '#f3f2de',
  'brand-5': '#ff6f86',
}

RGB Array

[109, 119, 144], [162, 202, 210], [214, 224, 213], [243, 242, 222], [255, 111, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6D7790, #A2CAD2, #D6E0D5, #F3F2DE, #FF6F86 is ideal for: health products, baby brands, fresh-style blogs, 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: #6d7790; --color-2: #a2cad2; --color-3: #d6e0d5; --color-4: #f3f2de; --color-5: #ff6f86. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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