#7A72A8 + #7D9EB8 + #90CAD1 + #B5F5E9 + #F5F4ED - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7A72A8

Deep Indigo · LightSlateGray · Navy Blue

HEX

#7A72A8

RGB

rgb(122, 114, 168)

HSL

hsl(249, 24%, 55%)

HSB

hsb(249, 32%, 66%)

CMYK

cmyk(27%, 32%, 0%, 34%)

Oklch

oklch(58.1% 0.082 290.4)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#7D9EB8

Sky Blue · CadetBlue · Cobalt Blue

HEX

#7D9EB8

RGB

rgb(125, 158, 184)

HSL

hsl(206, 29%, 61%)

HSB

hsb(206, 32%, 72%)

CMYK

cmyk(32%, 14%, 0%, 28%)

Oklch

oklch(68.4% 0.053 242.3)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#90CAD1

Sky Blue · SkyBlue · Lake Green

HEX

#90CAD1

RGB

rgb(144, 202, 209)

HSL

hsl(186, 41%, 69%)

HSB

hsb(186, 31%, 82%)

CMYK

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

Oklch

oklch(80.2% 0.060 205.4)

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

#B5F5E9

Jade · LightBlue · Glacier Blue

HEX

#B5F5E9

RGB

rgb(181, 245, 233)

HSL

hsl(169, 76%, 84%)

HSB

hsb(169, 26%, 96%)

CMYK

cmyk(26%, 0%, 5%, 4%)

Oklch

oklch(92.4% 0.066 181.9)

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

#F5F4ED

Fresh Green · Linen · Lemon Cream

HEX

#F5F4ED

RGB

rgb(245, 244, 237)

HSL

hsl(53, 29%, 95%)

HSB

hsb(53, 3%, 96%)

CMYK

cmyk(0%, 0%, 3%, 4%)

Oklch

oklch(96.6% 0.009 100.0)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A72A8

A0A871

Analogous

7184A8

7A72A8

9571A8

Triadic

7A72A8

A87971

71A879

Split-Comp.

7A72A8

A89571

84A871

Tetradic

7A72A8

A87184

A0A871

71A895

Contrast Matrix WCAG 2.1 Contrast

7A72A8	7D9EB8	90CAD1	B5F5E9	F5F4ED
—	1.6 Fail	2.4 Fail	3.6 AA Large	4.0 AA Large
1.6 Fail	—	1.5 Fail	2.3 Fail	2.6 Fail
2.4 Fail	1.5 Fail	—	1.5 Fail	1.6 Fail
3.6 AA Large	2.3 Fail	1.5 Fail	—	1.1 Fail
4.0 AA Large	2.6 Fail	1.6 Fail	1.1 Fail	—

White BG

4.4AA Large

2.8Fail

1.8Fail

1.2Fail

1.1Fail

Black BG

4.8AA

7.5AAA

11.6AAA

17.2AAA

19.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

77769B

8B8CB2

A9AACF

D1D1EC

F5F5EF

Deuteranopia

777898

8987B0

A6A1CF

CDC8ED

F5F5EF

Tritanopia

7A918E

7FADAC

93CECE

B8EEEF

F5F0F0

Achromatopsia

7B7B7B

979797

B9B9B9

E0E0E0

F4F4F4

Shades & Tints Shades & Tints

#7A72A8

Dark

Light

#7D9EB8

Dark

Light

#90CAD1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a72a8;
  --color-2: #7d9eb8;
  --color-3: #90cad1;
  --color-4: #b5f5e9;
  --color-5: #f5f4ed;
}

SCSS

$color-1: #7a72a8;
$color-2: #7d9eb8;
$color-3: #90cad1;
$color-4: #b5f5e9;
$color-5: #f5f4ed;

TAILWIND

colors: {
  'brand-1': '#7a72a8',
  'brand-2': '#7d9eb8',
  'brand-3': '#90cad1',
  'brand-4': '#b5f5e9',
  'brand-5': '#f5f4ed',
}

RGB Array

[122, 114, 168], [125, 158, 184], [144, 202, 209], [181, 245, 233], [245, 244, 237]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A72A8, #7D9EB8, #90CAD1, #B5F5E9, #F5F4ED 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: #7a72a8; --color-2: #7d9eb8; --color-3: #90cad1; --color-4: #b5f5e9; --color-5: #f5f4ed. 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