#74C5D4 + #A5D1C4 + #D6E8CF + #C4CC5A + #CED938 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#74C5D4

Sky Blue · SkyBlue · Lake Green

HEX

#74C5D4

RGB

rgb(116, 197, 212)

HSL

hsl(189, 53%, 64%)

HSB

hsb(189, 45%, 83%)

CMYK

cmyk(45%, 7%, 0%, 17%)

Oklch

oklch(77.7% 0.082 210.7)

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

#A5D1C4

Jade · LightSteelBlue · Lake Green

HEX

#A5D1C4

RGB

rgb(165, 209, 196)

HSL

hsl(162, 32%, 73%)

HSB

hsb(162, 21%, 82%)

CMYK

cmyk(21%, 0%, 6%, 18%)

Oklch

oklch(82.6% 0.050 175.1)

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

#D6E8CF

Celadon · LightGray · Mint Green

HEX

#D6E8CF

RGB

rgb(214, 232, 207)

HSL

hsl(103, 35%, 86%)

HSB

hsb(103, 11%, 91%)

CMYK

cmyk(8%, 0%, 11%, 9%)

Oklch

oklch(91.1% 0.039 136.9)

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

#C4CC5A

Autumn Sage · BurlyWood · Sunflower

HEX

#C4CC5A

RGB

rgb(196, 204, 90)

HSL

hsl(64, 53%, 58%)

HSB

hsb(64, 56%, 80%)

CMYK

cmyk(4%, 0%, 56%, 20%)

Oklch

oklch(81.6% 0.138 112.7)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#CED938

Autumn Sage · GreenYellow · Sunflower

HEX

#CED938

RGB

rgb(206, 217, 56)

HSL

hsl(64, 68%, 54%)

HSB

hsb(64, 74%, 85%)

CMYK

cmyk(5%, 0%, 74%, 15%)

Oklch

oklch(85.0% 0.174 113.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

74C5D4

D48173

Analogous

73D4B2

74C5D4

7395D4

Triadic

74C5D4

D473C5

C5D473

Split-Comp.

74C5D4

D47395

D4B273

Tetradic

74C5D4

B273D4

D48173

95D473

Contrast Matrix WCAG 2.1 Contrast

74C5D4	A5D1C4	D6E8CF	C4CC5A	CED938
—	1.2 Fail	1.5 Fail	1.1 Fail	1.3 Fail
1.2 Fail	—	1.3 Fail	1.0 Fail	1.1 Fail
1.5 Fail	1.3 Fail	—	1.3 Fail	1.2 Fail
1.1 Fail	1.0 Fail	1.3 Fail	—	1.1 Fail
1.3 Fail	1.1 Fail	1.2 Fail	1.1 Fail	—

White BG

2.0Fail

1.7Fail

1.3Fail

1.7Fail

1.5Fail

Black BG

10.7AAA

12.5AAA

16.3AAA

12.1AAA

13.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9798D0

B8B8C7

DEDED5

C7C876

D3D35F

Deuteranopia

928CCF

B6B2C8

DDDBD6

C7C67C

D2D168

Tritanopia

78CECD

A7CACA

D7DADB

C48B90

CF7E84

Achromatopsia

AEAEAE

C2C2C2

E0E0E0

BDBDBD

C3C3C3

Shades & Tints Shades & Tints

#74C5D4

Dark

Light

#A5D1C4

Dark

Light

#D6E8CF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #74c5d4;
  --color-2: #a5d1c4;
  --color-3: #d6e8cf;
  --color-4: #c4cc5a;
  --color-5: #ced938;
}

SCSS

$color-1: #74c5d4;
$color-2: #a5d1c4;
$color-3: #d6e8cf;
$color-4: #c4cc5a;
$color-5: #ced938;

TAILWIND

colors: {
  'brand-1': '#74c5d4',
  'brand-2': '#a5d1c4',
  'brand-3': '#d6e8cf',
  'brand-4': '#c4cc5a',
  'brand-5': '#ced938',
}

RGB Array

[116, 197, 212], [165, 209, 196], [214, 232, 207], [196, 204, 90], [206, 217, 56]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #74C5D4, #A5D1C4, #D6E8CF, #C4CC5A, #CED938 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: #74c5d4; --color-2: #a5d1c4; --color-3: #d6e8cf; --color-4: #c4cc5a; --color-5: #ced938. 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 cool-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