← Back to Editor

#7BC5AC · #ABC0A6 · #BBC5C4 · #DBD0C3 · #D4607C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7BC5AC

Jade · MediumAquaMarine · Lake Green

HEX
#7BC5AC
RGB
rgb(123, 197, 172)
HSL
hsl(160, 39%, 63%)
HSB
hsb(160, 38%, 77%)
CMYK
cmyk(38%, 0%, 13%, 23%)
Oklch
oklch(76.8% 0.083 170.6)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#ABC0A6

Celadon · DarkGray · Apple Green

HEX
#ABC0A6
RGB
rgb(171, 192, 166)
HSL
hsl(108, 17%, 70%)
HSB
hsb(108, 14%, 75%)
CMYK
cmyk(11%, 0%, 14%, 25%)
Oklch
oklch(78.5% 0.043 139.7)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#BBC5C4

Jade · Silver · Pearl Gray

HEX
#BBC5C4
RGB
rgb(187, 197, 196)
HSL
hsl(174, 8%, 75%)
HSB
hsb(174, 5%, 77%)
CMYK
cmyk(5%, 0%, 1%, 23%)
Oklch
oklch(81.5% 0.011 189.8)

TraditionalJade」· PaintPearl Gray」· Creative Silver Lining

#DBD0C3

Goose Yellow · LightGray · Peach Orange

HEX
#DBD0C3
RGB
rgb(219, 208, 195)
HSL
hsl(33, 25%, 81%)
HSB
hsb(33, 11%, 86%)
CMYK
cmyk(0%, 5%, 11%, 14%)
Oklch
oklch(86.3% 0.022 72.1)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#D4607C

Crimson · LightCoral · Passion Red

HEX
#D4607C
RGB
rgb(212, 96, 124)
HSL
hsl(346, 57%, 60%)
HSB
hsb(346, 55%, 83%)
CMYK
cmyk(0%, 55%, 42%, 17%)
Oklch
oklch(63.9% 0.148 7.1)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7BC5AC
C57C94

Analogous

7CC588
7BC5AC
7CB9C5

Triadic

7BC5AC
AD7CC5
C5AD7C

Split-Comp.

7BC5AC
C57CB9
C5887C

Tetradic

7BC5AC
887CC5
C57C94
B9C57C

Contrast Matrix WCAG 2.1 Contrast

7BC5AC
ABC0A6
BBC5C4
DBD0C3
D4607C
1.0
Fail
1.1
Fail
1.3
Fail
1.8
Fail
1.0
Fail
1.1
Fail
1.3
Fail
1.9
Fail
1.1
Fail
1.1
Fail
1.2
Fail
2.1
Fail
1.3
Fail
1.3
Fail
1.2
Fail
2.4
Fail
1.8
Fail
1.9
Fail
2.1
Fail
2.4
Fail
White BG
2.0Fail
1.9Fail
1.8Fail
1.5Fail
3.6AA Large
Black BG
10.4AAA
10.8AAA
11.9AAA
13.8AAA
5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9CB2
B4B4AC
BFBFC4
D6D6C6
A2A175

Deuteranopia

9791B4
B3B1AE
BFBEC4
D7D8C7
A9B174

Tritanopia

7FB7B8
ACB1B2
BCC4C4
DAC9C9
CE706F

Achromatopsia

ACACAC
B7B7B7
C2C2C2
D2D2D2
868686

Shades & Tints Shades & Tints

#7BC5AC

Dark
Light

#ABC0A6

Dark
Light

#BBC5C4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7bc5ac;
  --color-2: #abc0a6;
  --color-3: #bbc5c4;
  --color-4: #dbd0c3;
  --color-5: #d4607c;
}

SCSS

$color-1: #7bc5ac;
$color-2: #abc0a6;
$color-3: #bbc5c4;
$color-4: #dbd0c3;
$color-5: #d4607c;

TAILWIND

colors: {
  'brand-1': '#7bc5ac',
  'brand-2': '#abc0a6',
  'brand-3': '#bbc5c4',
  'brand-4': '#dbd0c3',
  'brand-5': '#d4607c',
}

RGB Array

[123, 197, 172], [171, 192, 166], [187, 197, 196], [219, 208, 195], [212, 96, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7BC5AC, #ABC0A6, #BBC5C4, #DBD0C3, #D4607C is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #7bc5ac; --color-2: #abc0a6; --color-3: #bbc5c4; --color-4: #dbd0c3; --color-5: #d4607c. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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