#A3CCCB + #41DAE2 + #3FCACF + #81A6A5 + #52AFB7 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A3CCCB

Jade · LightSteelBlue · Lake Green

HEX

#A3CCCB

RGB

rgb(163, 204, 203)

HSL

hsl(179, 29%, 72%)

HSB

hsb(179, 20%, 80%)

CMYK

cmyk(20%, 0%, 0%, 20%)

Oklch

oklch(81.6% 0.043 194.5)

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

#41DAE2

Lake Blue · Turquoise · Lake Green

HEX

#41DAE2

RGB

rgb(65, 218, 226)

HSL

hsl(183, 74%, 57%)

HSB

hsb(183, 71%, 89%)

CMYK

cmyk(71%, 4%, 0%, 11%)

Oklch

oklch(81.4% 0.124 200.2)

Traditional「Lake Blue」· Paint「Lake Green」· Creative Blush Sunrise

#3FCACF

Lake Blue · MediumTurquoise · Lake Green

HEX

#3FCACF

RGB

rgb(63, 202, 207)

HSL

hsl(182, 60%, 53%)

HSB

hsb(182, 70%, 81%)

CMYK

cmyk(70%, 2%, 0%, 19%)

Oklch

oklch(76.9% 0.116 198.6)

Traditional「Lake Blue」· Paint「Lake Green」· Creative Blush Sunrise

#81A6A5

Mineral Blue · LightSlateGray · Lake Green

HEX

#81A6A5

RGB

rgb(129, 166, 165)

HSL

hsl(178, 17%, 58%)

HSB

hsb(178, 22%, 65%)

CMYK

cmyk(22%, 0%, 1%, 35%)

Oklch

oklch(69.8% 0.040 194.2)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#52AFB7

Slate Blue · CadetBlue · Lake Green

HEX

#52AFB7

RGB

rgb(82, 175, 183)

HSL

hsl(185, 41%, 52%)

HSB

hsb(185, 55%, 72%)

CMYK

cmyk(55%, 4%, 0%, 28%)

Oklch

oklch(70.1% 0.088 202.9)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3CCCB

CCA3A4

Analogous

A3CCB7

A3CCCB

A3B8CC

Triadic

A3CCCB

CCA3CC

CCCCA3

Split-Comp.

A3CCCB

CCA3B8

CCB7A3

Tetradic

A3CCCB

B7A3CC

CCA3A4

B8CCA3

Contrast Matrix WCAG 2.1 Contrast

A3CCCB	41DAE2	3FCACF	81A6A5	52AFB7
—	1.0 Fail	1.1 Fail	1.5 Fail	1.5 Fail
1.0 Fail	—	1.2 Fail	1.6 Fail	1.5 Fail
1.1 Fail	1.2 Fail	—	1.3 Fail	1.3 Fail
1.5 Fail	1.6 Fail	1.3 Fail	—	1.0 Fail
1.5 Fail	1.5 Fail	1.3 Fail	1.0 Fail	—

White BG

1.7Fail

2.0Fail

2.6Fail

Black BG

12.1AAA

12.4AAA

10.6AAA

7.9AAA

8.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B5CB

8385E0

7B7CCE

9191A5

7A7BB5

Deuteranopia

B2AFCB

7A6FE0

7369CD

8F8CA5

756EB5

Tritanopia

A5CBCB

49DFDE

46CDCD

83A5A5

57B4B3

Achromatopsia

C0C0C0

ADADAD

A1A1A1

9B9B9B

949494

Shades & Tints Shades & Tints

#A3CCCB

Dark

Light

#41DAE2

Dark

Light

#3FCACF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3cccb;
  --color-2: #41dae2;
  --color-3: #3fcacf;
  --color-4: #81a6a5;
  --color-5: #52afb7;
}

SCSS

$color-1: #a3cccb;
$color-2: #41dae2;
$color-3: #3fcacf;
$color-4: #81a6a5;
$color-5: #52afb7;

TAILWIND

colors: {
  'brand-1': '#a3cccb',
  'brand-2': '#41dae2',
  'brand-3': '#3fcacf',
  'brand-4': '#81a6a5',
  'brand-5': '#52afb7',
}

RGB Array

[163, 204, 203], [65, 218, 226], [63, 202, 207], [129, 166, 165], [82, 175, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #A3CCCB, #41DAE2, #3FCACF, #81A6A5, #52AFB7 is ideal for: corporate websites, product showcases, portfolios. 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: #a3cccb; --color-2: #41dae2; --color-3: #3fcacf; --color-4: #81a6a5; --color-5: #52afb7. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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