← Back to Editor

#ADCCCF · #757F91 · #543F49 · #2A242F · #76382A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#ADCCCF

Sky Blue · LightSteelBlue · Lake Green

HEX
#ADCCCF
RGB
rgb(173, 204, 207)
HSL
hsl(185, 26%, 75%)
HSB
hsb(185, 16%, 81%)
CMYK
cmyk(16%, 1%, 0%, 19%)
Oklch
oklch(82.3% 0.033 203.7)

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

#757F91

Azure · SlateGray · Navy Blue

HEX
#757F91
RGB
rgb(117, 127, 145)
HSL
hsl(219, 11%, 51%)
HSB
hsb(219, 19%, 57%)
CMYK
cmyk(19%, 12%, 0%, 43%)
Oklch
oklch(59.4% 0.030 262.3)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#543F49

Dark Violet · DarkSlateGray · Camellia

HEX
#543F49
RGB
rgb(84, 63, 73)
HSL
hsl(331, 14%, 29%)
HSB
hsb(331, 25%, 33%)
CMYK
cmyk(0%, 25%, 13%, 67%)
Oklch
oklch(39.4% 0.033 348.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#2A242F

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2A242F
RGB
rgb(42, 36, 47)
HSL
hsl(273, 13%, 16%)
HSB
hsb(273, 23%, 18%)
CMYK
cmyk(11%, 23%, 0%, 82%)
Oklch
oklch(27.2% 0.022 309.5)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#76382A

Crimson · Brown · Wine Red

HEX
#76382A
RGB
rgb(118, 56, 42)
HSL
hsl(11, 48%, 31%)
HSB
hsb(11, 64%, 46%)
CMYK
cmyk(0%, 53%, 64%, 54%)
Oklch
oklch(41.9% 0.091 34.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ADCCCF
D0B1AF

Analogous

AFD0C2
ADCCCF
AFBCD0

Triadic

ADCCCF
D0AFCD
CDD0AF

Split-Comp.

ADCCCF
D0AFBC
D0C2AF

Tetradic

ADCCCF
C2AFD0
D0B1AF
BCD0AF

Contrast Matrix WCAG 2.1 Contrast

ADCCCF
757F91
543F49
2A242F
76382A
—
2.4
Fail
5.6
AA
8.8
AAA
5.2
AA
2.4
Fail
—
2.4
Fail
3.7
AA Large
2.2
Fail
5.6
AA
2.4
Fail
—
1.6
Fail
1.1
Fail
8.8
AAA
3.7
AA Large
1.6
Fail
—
1.7
Fail
5.2
AA
2.2
Fail
1.1
Fail
1.7
Fail
—
White BG
1.7Fail
4.0AA Large
9.6AAA
15.1AAA
8.9AAA
Black BG
12.3AAA
5.2AA
2.2Fail
1.4Fail
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABBCE
79798D
4B4B47
27272C
5B5B2D

Deuteranopia

B9B6CE
79788C
4C4E46
28282C
5F632E

Tritanopia

AFCECE
758988
534544
2A2A2A
733031

Achromatopsia

C3C3C3
7E7E7E
464646
272727
494949

Shades & Tints Shades & Tints

#ADCCCF

Dark
Light

#757F91

Dark
Light

#543F49

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #adcccf;
  --color-2: #757f91;
  --color-3: #543f49;
  --color-4: #2a242f;
  --color-5: #76382a;
}

SCSS

$color-1: #adcccf;
$color-2: #757f91;
$color-3: #543f49;
$color-4: #2a242f;
$color-5: #76382a;

TAILWIND

colors: {
  'brand-1': '#adcccf',
  'brand-2': '#757f91',
  'brand-3': '#543f49',
  'brand-4': '#2a242f',
  'brand-5': '#76382a',
}

RGB Array

[173, 204, 207], [117, 127, 145], [84, 63, 73], [42, 36, 47], [118, 56, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ADCCCF, #757F91, #543F49, #2A242F, #76382A is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #adcccf; --color-2: #757f91; --color-3: #543f49; --color-4: #2a242f; --color-5: #76382a. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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. 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