← Back to Editor

#A7A7CC · #89BFCC · #9DD4BF · #C3CFBF · #DBCBCA

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

WorkspaceReading

Color Details Color Details

#A7A7CC

Wisteria · DarkGray · Cobalt Blue

HEX
#A7A7CC
RGB
rgb(167, 167, 204)
HSL
hsl(240, 27%, 73%)
HSB
hsb(240, 18%, 80%)
CMYK
cmyk(18%, 18%, 0%, 20%)
Oklch
oklch(74.1% 0.053 285.0)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#89BFCC

Sky Blue · SkyBlue · Lake Green

HEX
#89BFCC
RGB
rgb(137, 191, 204)
HSL
hsl(192, 40%, 67%)
HSB
hsb(192, 33%, 80%)
CMYK
cmyk(33%, 6%, 0%, 20%)
Oklch
oklch(77.2% 0.059 214.3)

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

#9DD4BF

Jade · LightSteelBlue · Apple Green

HEX
#9DD4BF
RGB
rgb(157, 212, 191)
HSL
hsl(157, 39%, 72%)
HSB
hsb(157, 26%, 83%)
CMYK
cmyk(26%, 0%, 10%, 17%)
Oklch
oklch(82.6% 0.064 169.2)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#C3CFBF

Celadon · Silver · Apple Green

HEX
#C3CFBF
RGB
rgb(195, 207, 191)
HSL
hsl(105, 14%, 78%)
HSB
hsb(105, 8%, 81%)
CMYK
cmyk(6%, 0%, 8%, 19%)
Oklch
oklch(84.1% 0.025 137.8)

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

#DBCBCA

Peach Pink · LightGray · Cherry Blossom

HEX
#DBCBCA
RGB
rgb(219, 203, 202)
HSL
hsl(4, 19%, 83%)
HSB
hsb(4, 8%, 86%)
CMYK
cmyk(0%, 7%, 8%, 14%)
Oklch
oklch(85.5% 0.018 21.8)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7A7CC
CDCDA8

Analogous

A8BACD
A7A7CC
BAA8CD

Triadic

A7A7CC
CDA8A8
A8CDA8

Split-Comp.

A7A7CC
CDBAA8
BACDA8

Tetradic

A7A7CC
CDA8BA
CDCDA8
A8CDBA

Contrast Matrix WCAG 2.1 Contrast

A7A7CC
89BFCC
9DD4BF
C3CFBF
DBCBCA
—
1.1
Fail
1.4
Fail
1.4
Fail
1.5
Fail
1.1
Fail
—
1.2
Fail
1.3
Fail
1.3
Fail
1.4
Fail
1.2
Fail
—
1.0
Fail
1.1
Fail
1.4
Fail
1.3
Fail
1.0
Fail
—
1.0
Fail
1.5
Fail
1.3
Fail
1.1
Fail
1.0
Fail
—
White BG
2.3Fail
2.0Fail
1.7Fail
1.6Fail
1.6Fail
Black BG
9.0AAA
10.4AAA
12.6AAA
13.0AAA
13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A7C3
A0A1C9
B5B5C4
C8C8C3
D4D4CA

Deuteranopia

A7A7C1
9D99C8
B2AEC5
C8C7C4
D5D6CA

Tritanopia

A7BCBA
8CC6C6
A0C8C9
C4C6C7
DACACA

Achromatopsia

ABABAB
B0B0B0
C1C1C1
CACACA
D0D0D0

Shades & Tints Shades & Tints

#A7A7CC

Dark
Light

#89BFCC

Dark
Light

#9DD4BF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7a7cc;
  --color-2: #89bfcc;
  --color-3: #9dd4bf;
  --color-4: #c3cfbf;
  --color-5: #dbcbca;
}

SCSS

$color-1: #a7a7cc;
$color-2: #89bfcc;
$color-3: #9dd4bf;
$color-4: #c3cfbf;
$color-5: #dbcbca;

TAILWIND

colors: {
  'brand-1': '#a7a7cc',
  'brand-2': '#89bfcc',
  'brand-3': '#9dd4bf',
  'brand-4': '#c3cfbf',
  'brand-5': '#dbcbca',
}

RGB Array

[167, 167, 204], [137, 191, 204], [157, 212, 191], [195, 207, 191], [219, 203, 202]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A7A7CC, #89BFCC, #9DD4BF, #C3CFBF, #DBCBCA is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #a7a7cc; --color-2: #89bfcc; --color-3: #9dd4bf; --color-4: #c3cfbf; --color-5: #dbcbca. 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 beauty, lifestyle, arts 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