← Back to Editor

#7AEFF9 · #91DFF3 · #A4BBE7 · #ABAAE3 · #A691CA

nature

A 5-color nature palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile App

Color Details Color Details

#7AEFF9

Sky Blue · LightSkyBlue · Lake Green

HEX
#7AEFF9
RGB
rgb(122, 239, 249)
HSL
hsl(185, 91%, 73%)
HSB
hsb(185, 51%, 98%)
CMYK
cmyk(51%, 4%, 0%, 2%)
Oklch
oklch(88.8% 0.107 202.8)

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

#91DFF3

Sky Blue · LightSkyBlue · Glacier Blue

HEX
#91DFF3
RGB
rgb(145, 223, 243)
HSL
hsl(192, 80%, 76%)
HSB
hsb(192, 40%, 95%)
CMYK
cmyk(40%, 8%, 0%, 5%)
Oklch
oklch(86.0% 0.081 215.8)

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

#A4BBE7

Azure · LightSteelBlue · Cobalt Blue

HEX
#A4BBE7
RGB
rgb(164, 187, 231)
HSL
hsl(219, 58%, 77%)
HSB
hsb(219, 29%, 91%)
CMYK
cmyk(29%, 19%, 0%, 9%)
Oklch
oklch(79.0% 0.068 263.3)

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

#ABAAE3

Wisteria · LightSteelBlue · Cobalt Blue

HEX
#ABAAE3
RGB
rgb(171, 170, 227)
HSL
hsl(241, 50%, 78%)
HSB
hsb(241, 25%, 89%)
CMYK
cmyk(25%, 25%, 0%, 11%)
Oklch
oklch(75.9% 0.081 285.1)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A691CA

Wisteria · DarkGray · Lilac Purple

HEX
#A691CA
RGB
rgb(166, 145, 202)
HSL
hsl(262, 35%, 68%)
HSB
hsb(262, 28%, 79%)
CMYK
cmyk(18%, 28%, 0%, 21%)
Oklch
oklch(69.6% 0.085 301.1)

Traditional「Wisteria」· Paint「Lilac Purple」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7AEFF9
F9867B

Analogous

7BF9C5
7AEFF9
7BB0F9

Triadic

7AEFF9
F97BEE
EEF97B

Split-Comp.

7AEFF9
F97BB0
F9C57B

Tetradic

7AEFF9
C57BF9
F9867B
B0F97B

Contrast Matrix WCAG 2.1 Contrast

7AEFF9
91DFF3
A4BBE7
ABAAE3
A691CA
—
1.1
Fail
1.4
Fail
1.6
Fail
2.1
Fail
1.1
Fail
—
1.3
Fail
1.5
Fail
1.9
Fail
1.4
Fail
1.3
Fail
—
1.1
Fail
1.4
Fail
1.6
Fail
1.5
Fail
1.1
Fail
—
1.3
Fail
2.1
Fail
1.9
Fail
1.4
Fail
1.3
Fail
—
White BG
1.4Fail
1.5Fail
1.9Fail
2.2Fail
2.8Fail
Black BG
15.5AAA
14.1AAA
10.8AAA
9.6AAA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ADAEF7
B3B3EE
AEAEDC
ABABD5
9D9DBC

Deuteranopia

A69DF6
AEA8ED
ADABDA
ABABD2
9EA0B9

Tritanopia

80F5F4
95EAEA
A5D4D2
ABCAC8
A5B1AF

Achromatopsia

CDCDCD
CACACA
B9B9B9
B1B1B1
9E9E9E

Shades & Tints Shades & Tints

#7AEFF9

Dark
Light

#91DFF3

Dark
Light

#A4BBE7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7aeff9;
  --color-2: #91dff3;
  --color-3: #a4bbe7;
  --color-4: #abaae3;
  --color-5: #a691ca;
}

SCSS

$color-1: #7aeff9;
$color-2: #91dff3;
$color-3: #a4bbe7;
$color-4: #abaae3;
$color-5: #a691ca;

TAILWIND

colors: {
  'brand-1': '#7aeff9',
  'brand-2': '#91dff3',
  'brand-3': '#a4bbe7',
  'brand-4': '#abaae3',
  'brand-5': '#a691ca',
}

RGB Array

[122, 239, 249], [145, 223, 243], [164, 187, 231], [171, 170, 227], [166, 145, 202]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #7AEFF9, #91DFF3, #A4BBE7, #ABAAE3, #A691CA is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #7aeff9; --color-2: #91dff3; --color-3: #a4bbe7; --color-4: #abaae3; --color-5: #a691ca. 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 nature-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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