#6B68AC + #739EE6 + #8AC2D8 + #A2E1D2 + #DBF8CD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#6B68AC

Deep Indigo · SlateBlue · Navy Blue

HEX

#6B68AC

RGB

rgb(107, 104, 172)

HSL

hsl(243, 29%, 54%)

HSB

hsb(243, 40%, 67%)

CMYK

cmyk(38%, 40%, 0%, 33%)

Oklch

oklch(55.0% 0.104 284.4)

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

#739EE6

Azure · CornflowerBlue · Cobalt Blue

HEX

#739EE6

RGB

rgb(115, 158, 230)

HSL

hsl(218, 70%, 68%)

HSB

hsb(218, 50%, 90%)

CMYK

cmyk(50%, 31%, 0%, 10%)

Oklch

oklch(69.8% 0.116 260.3)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#8AC2D8

Sky Blue · SkyBlue · Lake Green

HEX

#8AC2D8

RGB

rgb(138, 194, 216)

HSL

hsl(197, 50%, 69%)

HSB

hsb(197, 36%, 85%)

CMYK

cmyk(36%, 10%, 0%, 15%)

Oklch

oklch(78.3% 0.066 224.4)

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

#A2E1D2

Jade · LightBlue · Glacier Blue

HEX

#A2E1D2

RGB

rgb(162, 225, 210)

HSL

hsl(166, 51%, 76%)

HSB

hsb(166, 28%, 88%)

CMYK

cmyk(28%, 0%, 7%, 12%)

Oklch

oklch(86.3% 0.067 178.2)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#DBF8CD

Emerald · Beige · Mint Green

HEX

#DBF8CD

RGB

rgb(219, 248, 205)

HSL

hsl(100, 75%, 89%)

HSB

hsb(100, 17%, 97%)

CMYK

cmyk(12%, 0%, 17%, 3%)

Oklch

oklch(94.7% 0.064 135.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6B68AC

A8AC68

Analogous

6886AC

6B68AC

8D68AC

Triadic

6B68AC

AC6B68

68AC6B

Split-Comp.

6B68AC

AC8D68

86AC68

Tetradic

6B68AC

AC6886

A8AC68

68AC8D

Contrast Matrix WCAG 2.1 Contrast

6B68AC	739EE6	8AC2D8	A2E1D2	DBF8CD
—	1.8 Fail	2.6 Fail	3.4 AA Large	4.4 AA Large
1.8 Fail	—	1.4 Fail	1.8 Fail	2.4 Fail
2.6 Fail	1.4 Fail	—	1.3 Fail	1.7 Fail
3.4 AA Large	1.8 Fail	1.3 Fail	—	1.3 Fail
4.4 AA Large	2.4 Fail	1.7 Fail	1.3 Fail	—

White BG

5.0AA

2.7Fail

1.9Fail

1.5Fail

1.1Fail

Black BG

4.2AA Large

7.8AAA

10.8AAA

14.2AAA

18.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6A6A9C

8686D5

A2A3D3

BDBED6

E8E8D7

Deuteranopia

6A6A98

8380D0

9F9BD1

BAB5D7

E6E4DA

Tritanopia

6B8F8C

75C7C4

8DCECE

A5D8D9

DCE0E1

Achromatopsia

717171

999999

B4B4B4

CCCCCC

EAEAEA

Shades & Tints Shades & Tints

#6B68AC

Dark

Light

#739EE6

Dark

Light

#8AC2D8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6b68ac;
  --color-2: #739ee6;
  --color-3: #8ac2d8;
  --color-4: #a2e1d2;
  --color-5: #dbf8cd;
}

SCSS

$color-1: #6b68ac;
$color-2: #739ee6;
$color-3: #8ac2d8;
$color-4: #a2e1d2;
$color-5: #dbf8cd;

TAILWIND

colors: {
  'brand-1': '#6b68ac',
  'brand-2': '#739ee6',
  'brand-3': '#8ac2d8',
  'brand-4': '#a2e1d2',
  'brand-5': '#dbf8cd',
}

RGB Array

[107, 104, 172], [115, 158, 230], [138, 194, 216], [162, 225, 210], [219, 248, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6B68AC, #739EE6, #8AC2D8, #A2E1D2, #DBF8CD is ideal for: health products, baby brands, fresh-style blogs. 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: #6b68ac; --color-2: #739ee6; --color-3: #8ac2d8; --color-4: #a2e1d2; --color-5: #dbf8cd. 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. 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