#AADDDD + #618B64 + #FF4A32 + #ADE7CE + #AADDDD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#AADDDD

Sky Blue · LightBlue · Glacier Blue

HEX

#AADDDD

RGB

rgb(170, 221, 221)

HSL

hsl(180, 43%, 77%)

HSB

hsb(180, 23%, 87%)

CMYK

cmyk(23%, 0%, 0%, 13%)

Oklch

oklch(86.2% 0.053 196.2)

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

#618B64

Celadon · DimGray · Olive Green

HEX

#618B64

RGB

rgb(97, 139, 100)

HSL

hsl(124, 18%, 46%)

HSB

hsb(124, 30%, 55%)

CMYK

cmyk(30%, 0%, 28%, 45%)

Oklch

oklch(59.5% 0.075 146.3)

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

#FF4A32

Vermilion · Tomato · Passion Red

HEX

#FF4A32

RGB

rgb(255, 74, 50)

HSL

hsl(7, 100%, 60%)

HSB

hsb(7, 80%, 100%)

CMYK

cmyk(0%, 71%, 80%, 0%)

Oklch

oklch(66.7% 0.221 30.9)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#ADE7CE

Jade · LightBlue · Apple Green

HEX

#ADE7CE

RGB

rgb(173, 231, 206)

HSL

hsl(154, 55%, 79%)

HSB

hsb(154, 25%, 91%)

CMYK

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

Oklch

oklch(88.1% 0.069 166.5)

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

#AADDDD

Sky Blue · LightBlue · Glacier Blue

HEX

#AADDDD

RGB

rgb(170, 221, 221)

HSL

hsl(180, 43%, 77%)

HSB

hsb(180, 23%, 87%)

CMYK

cmyk(23%, 0%, 0%, 13%)

Oklch

oklch(86.2% 0.053 196.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AADDDD

DEABAB

Analogous

ABDEC4

AADDDD

ABC4DE

Triadic

AADDDD

DEABDE

DEDEAB

Split-Comp.

AADDDD

DEABC4

DEC4AB

Tetradic

AADDDD

C4ABDE

DEABAB

C4DEAB

Contrast Matrix WCAG 2.1 Contrast

AADDDD	618B64	FF4A32	ADE7CE	AADDDD
—	2.6 Fail	2.2 Fail	1.1 Fail	—
2.6 Fail	—	1.2 Fail	2.8 Fail	2.6 Fail
2.2 Fail	1.2 Fail	—	2.4 Fail	2.2 Fail
1.1 Fail	2.8 Fail	2.4 Fail	—	1.1 Fail
—	2.6 Fail	2.2 Fail	1.1 Fail	—

White BG

1.5Fail

3.9AA Large

3.3AA Large

1.4Fail

1.5Fail

Black BG

14.1AAA

5.4AA

6.3AA

15.1AAA

14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C0C1DD

73746D

B1AF38

C6C7D4

C0C1DD

Deuteranopia

BDB9DD

716E70

BBC939

C3BED6

BDB9DD

Tritanopia

ADDDDD

637577

F63C3D

B0D9DA

ADDDDD

Achromatopsia

CECECE

7A7A7A

7D7D7D

D3D3D3

CECECE

Shades & Tints Shades & Tints

#AADDDD

Dark

Light

#618B64

Dark

Light

#FF4A32

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aadddd;
  --color-2: #618b64;
  --color-3: #ff4a32;
  --color-4: #ade7ce;
  --color-5: #aadddd;
}

SCSS

$color-1: #aadddd;
$color-2: #618b64;
$color-3: #ff4a32;
$color-4: #ade7ce;
$color-5: #aadddd;

TAILWIND

colors: {
  'brand-1': '#aadddd',
  'brand-2': '#618b64',
  'brand-3': '#ff4a32',
  'brand-4': '#ade7ce',
  'brand-5': '#aadddd',
}

RGB Array

[170, 221, 221], [97, 139, 100], [255, 74, 50], [173, 231, 206], [170, 221, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AADDDD, #618B64, #FF4A32, #ADE7CE, #AADDDD 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: #aadddd; --color-2: #618b64; --color-3: #ff4a32; --color-4: #ade7ce; --color-5: #aadddd. 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 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