#CAD0C6 + #ECDFD6 + #EBADB0 + #EB6A88 + #CCDEE0 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CAD0C6

Celadon · LightGray · Apple Green

HEX

#CAD0C6

RGB

rgb(202, 208, 198)

HSL

hsl(96, 10%, 80%)

HSB

hsb(96, 5%, 82%)

CMYK

cmyk(3%, 0%, 5%, 18%)

Oklch

oklch(85.0% 0.015 132.5)

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

#ECDFD6

Apricot · Beige · Peach Orange

HEX

#ECDFD6

RGB

rgb(236, 223, 214)

HSL

hsl(25, 37%, 88%)

HSB

hsb(25, 9%, 93%)

CMYK

cmyk(0%, 6%, 9%, 7%)

Oklch

oklch(91.2% 0.019 57.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#EBADB0

Peach Pink · LightPink · Coral Red

HEX

#EBADB0

RGB

rgb(235, 173, 176)

HSL

hsl(357, 61%, 80%)

HSB

hsb(357, 26%, 92%)

CMYK

cmyk(0%, 26%, 25%, 8%)

Oklch

oklch(80.6% 0.073 15.6)

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

#EB6A88

Peach Pink · LightCoral · Coral Red

HEX

#EB6A88

RGB

rgb(235, 106, 136)

HSL

hsl(346, 76%, 67%)

HSB

hsb(346, 55%, 92%)

CMYK

cmyk(0%, 55%, 42%, 8%)

Oklch

oklch(68.8% 0.161 7.8)

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

#CCDEE0

Sky Blue · LightGray · Glacier Blue

HEX

#CCDEE0

RGB

rgb(204, 222, 224)

HSL

hsl(186, 24%, 84%)

HSB

hsb(186, 9%, 88%)

CMYK

cmyk(9%, 1%, 0%, 12%)

Oklch

oklch(88.8% 0.019 204.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAD0C6

CDC7D1

Analogous

D0D1C7

CAD0C6

C7D1C8

Triadic

CAD0C6

C7CBD1

D1C7CB

Split-Comp.

CAD0C6

C8C7D1

D1C7D0

Tetradic

CAD0C6

C7D0D1

CDC7D1

D1C8C7

Contrast Matrix WCAG 2.1 Contrast

CAD0C6	ECDFD6	EBADB0	EB6A88	CCDEE0
—	1.2 Fail	1.2 Fail	1.9 Fail	1.1 Fail
1.2 Fail	—	1.4 Fail	2.3 Fail	1.1 Fail
1.2 Fail	1.4 Fail	—	1.6 Fail	1.4 Fail
1.9 Fail	2.3 Fail	1.6 Fail	—	2.2 Fail
1.1 Fail	1.1 Fail	1.4 Fail	2.2 Fail	—

White BG

1.6Fail

1.3Fail

1.9Fail

3.0AA Large

1.4Fail

Black BG

13.3AAA

16.1AAA

11.1AAA

6.9AA

15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCDC8

E6E6D8

D0D0AF

B3B281

D4D4E0

Deuteranopia

CCCCC9

E7E8D9

D4D8AF

BBC47F

D3D1DF

Tritanopia

CACACB

EBDADA

E8AFAF

E57B7A

CDDFDF

Achromatopsia

CDCDCD

E2E2E2

C0C0C0

949494

D9D9D9

Shades & Tints Shades & Tints

#CAD0C6

Dark

Light

#ECDFD6

Dark

Light

#EBADB0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cad0c6;
  --color-2: #ecdfd6;
  --color-3: #ebadb0;
  --color-4: #eb6a88;
  --color-5: #ccdee0;
}

SCSS

$color-1: #cad0c6;
$color-2: #ecdfd6;
$color-3: #ebadb0;
$color-4: #eb6a88;
$color-5: #ccdee0;

TAILWIND

colors: {
  'brand-1': '#cad0c6',
  'brand-2': '#ecdfd6',
  'brand-3': '#ebadb0',
  'brand-4': '#eb6a88',
  'brand-5': '#ccdee0',
}

RGB Array

[202, 208, 198], [236, 223, 214], [235, 173, 176], [235, 106, 136], [204, 222, 224]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #CAD0C6, #ECDFD6, #EBADB0, #EB6A88, #CCDEE0 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: #cad0c6; --color-2: #ecdfd6; --color-3: #ebadb0; --color-4: #eb6a88; --color-5: #ccdee0. 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 bright-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