#72ABA5 + #7DDBBA + #AAED76 + #D6FF32 + #CFE8E5 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#72ABA5

Mineral Blue · CadetBlue · Lake Green

HEX

#72ABA5

RGB

rgb(114, 171, 165)

HSL

hsl(174, 25%, 56%)

HSB

hsb(174, 33%, 67%)

CMYK

cmyk(33%, 0%, 4%, 33%)

Oklch

oklch(70.0% 0.060 187.6)

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

#7DDBBA

Jade · MediumAquaMarine · Apple Green

HEX

#7DDBBA

RGB

rgb(125, 219, 186)

HSL

hsl(159, 57%, 67%)

HSB

hsb(159, 43%, 86%)

CMYK

cmyk(43%, 0%, 15%, 14%)

Oklch

oklch(82.4% 0.102 169.1)

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

#AAED76

Emerald · LightGreen · Apple Green

HEX

#AAED76

RGB

rgb(170, 237, 118)

HSL

hsl(94, 77%, 70%)

HSB

hsb(94, 50%, 93%)

CMYK

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

Oklch

oklch(87.6% 0.166 133.1)

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

#D6FF32

Grass Green · GreenYellow · Olive Green

HEX

#D6FF32

RGB

rgb(214, 255, 50)

HSL

hsl(72, 100%, 60%)

HSB

hsb(72, 80%, 100%)

CMYK

cmyk(16%, 0%, 80%, 0%)

Oklch

oklch(93.9% 0.214 121.2)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#CFE8E5

Jade · LightGray · Glacier Blue

HEX

#CFE8E5

RGB

rgb(207, 232, 229)

HSL

hsl(173, 35%, 86%)

HSB

hsb(173, 11%, 91%)

CMYK

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

Oklch

oklch(91.2% 0.027 188.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

72ABA5

AB7378

Analogous

73AB89

72ABA5

7394AB

Triadic

72ABA5

A573AB

ABA573

Split-Comp.

72ABA5

AB7394

AB8973

Tetradic

72ABA5

8973AB

AB7378

94AB73

Contrast Matrix WCAG 2.1 Contrast

72ABA5	7DDBBA	AAED76	D6FF32	CFE8E5
—	1.6 Fail	1.9 Fail	2.3 Fail	2.0 Fail
1.6 Fail	—	1.2 Fail	1.4 Fail	1.3 Fail
1.9 Fail	1.2 Fail	—	1.2 Fail	1.1 Fail
2.3 Fail	1.4 Fail	1.2 Fail	—	1.1 Fail
2.0 Fail	1.3 Fail	1.1 Fail	1.1 Fail	—

White BG

2.6Fail

1.7Fail

1.4Fail

1.2Fail

1.3Fail

Black BG

8.1AAA

12.7AAA

15.1AAA

18.2AAA

16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8B8BA6

A6A7C2

C7C893

E8E864

DADAE6

Deuteranopia

8783A7

A099C4

C3BE9A

E5E270

D8D6E6

Tritanopia

75A8A8

82C8CA

ADAAAF

D88B93

D0E6E6

Achromatopsia

999999

BBBBBB

CBCBCB

DBDBDB

E0E0E0

Shades & Tints Shades & Tints

#72ABA5

Dark

Light

#7DDBBA

Dark

Light

#AAED76

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #72aba5;
  --color-2: #7ddbba;
  --color-3: #aaed76;
  --color-4: #d6ff32;
  --color-5: #cfe8e5;
}

SCSS

$color-1: #72aba5;
$color-2: #7ddbba;
$color-3: #aaed76;
$color-4: #d6ff32;
$color-5: #cfe8e5;

TAILWIND

colors: {
  'brand-1': '#72aba5',
  'brand-2': '#7ddbba',
  'brand-3': '#aaed76',
  'brand-4': '#d6ff32',
  'brand-5': '#cfe8e5',
}

RGB Array

[114, 171, 165], [125, 219, 186], [170, 237, 118], [214, 255, 50], [207, 232, 229]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #72ABA5, #7DDBBA, #AAED76, #D6FF32, #CFE8E5 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: #72aba5; --color-2: #7ddbba; --color-3: #aaed76; --color-4: #d6ff32; --color-5: #cfe8e5. 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