#B07676 + #B0A2A2 + #A9C7C7 + #AAF0F0 + #DBFFFF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B07676

Crimson · Gray · Passion Red

HEX

#B07676

RGB

rgb(176, 118, 118)

HSL

hsl(0, 27%, 58%)

HSB

hsb(0, 33%, 69%)

CMYK

cmyk(0%, 33%, 33%, 31%)

Oklch

oklch(62.6% 0.073 19.3)

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

#B0A2A2

Peach Pink · DarkGray · Silver Sand

HEX

#B0A2A2

RGB

rgb(176, 162, 162)

HSL

hsl(0, 8%, 66%)

HSB

hsb(0, 8%, 69%)

CMYK

cmyk(0%, 8%, 8%, 31%)

Oklch

oklch(72.4% 0.016 17.5)

Traditional「Peach Pink」· Paint「Silver Sand」· Creative Urban Concrete

#A9C7C7

Sky Blue · LightSteelBlue · Lake Green

HEX

#A9C7C7

RGB

rgb(169, 199, 199)

HSL

hsl(180, 21%, 72%)

HSB

hsb(180, 15%, 78%)

CMYK

cmyk(15%, 0%, 0%, 22%)

Oklch

oklch(80.8% 0.032 196.5)

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

#AAF0F0

Sky Blue · LightBlue · Glacier Blue

HEX

#AAF0F0

RGB

rgb(170, 240, 240)

HSL

hsl(180, 70%, 80%)

HSB

hsb(180, 29%, 94%)

CMYK

cmyk(29%, 0%, 0%, 6%)

Oklch

oklch(90.9% 0.069 196.0)

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

#DBFFFF

Sky Blue · Lavender · Glacier Blue

HEX

#DBFFFF

RGB

rgb(219, 255, 255)

HSL

hsl(180, 100%, 93%)

HSB

hsb(180, 14%, 100%)

CMYK

cmyk(14%, 0%, 0%, 0%)

Oklch

oklch(97.5% 0.037 196.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B07676

77B1B1

Analogous

B17794

B07676

B19477

Triadic

B07676

77B177

7777B1

Split-Comp.

B07676

77B194

7794B1

Tetradic

B07676

94B177

77B1B1

9477B1

Contrast Matrix WCAG 2.1 Contrast

B07676	B0A2A2	A9C7C7	AAF0F0	DBFFFF
—	1.5 Fail	2.0 Fail	2.9 Fail	3.5 AA Large
1.5 Fail	—	1.4 Fail	1.9 Fail	2.3 Fail
2.0 Fail	1.4 Fail	—	1.4 Fail	1.7 Fail
2.9 Fail	1.9 Fail	1.4 Fail	—	1.2 Fail
3.5 AA Large	2.3 Fail	1.7 Fail	1.2 Fail	—

White BG

3.7AA Large

2.5Fail

1.8Fail

1.3Fail

1.1Fail

Black BG

5.7AA

8.5AAA

11.7AAA

16.4AAA

19.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

979676

AAAAA2

B6B6C7

C8C9F0

EBEBFF

Deuteranopia

9A9F76

ABACA2

B4B2C7

C4BFF0

E9E6FF

Tritanopia

AD7676

AFA2A2

AAC7C7

AEF0F0

DDFFFF

Achromatopsia

878787

A6A6A6

BEBEBE

DBDBDB

F4F4F4

Shades & Tints Shades & Tints

#B07676

Dark

Light

#B0A2A2

Dark

Light

#A9C7C7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b07676;
  --color-2: #b0a2a2;
  --color-3: #a9c7c7;
  --color-4: #aaf0f0;
  --color-5: #dbffff;
}

SCSS

$color-1: #b07676;
$color-2: #b0a2a2;
$color-3: #a9c7c7;
$color-4: #aaf0f0;
$color-5: #dbffff;

TAILWIND

colors: {
  'brand-1': '#b07676',
  'brand-2': '#b0a2a2',
  'brand-3': '#a9c7c7',
  'brand-4': '#aaf0f0',
  'brand-5': '#dbffff',
}

RGB Array

[176, 118, 118], [176, 162, 162], [169, 199, 199], [170, 240, 240], [219, 255, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B07676, #B0A2A2, #A9C7C7, #AAF0F0, #DBFFFF 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: #b07676; --color-2: #b0a2a2; --color-3: #a9c7c7; --color-4: #aaf0f0; --color-5: #dbffff. 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