← Back to Editor

#83D6A3 · #A3B285 · #AF7265 · #AC3F5A · #4E2635

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#83D6A3

Celadon · MediumAquaMarine · Apple Green

HEX
#83D6A3
RGB
rgb(131, 214, 163)
HSL
hsl(143, 50%, 68%)
HSB
hsb(143, 39%, 84%)
CMYK
cmyk(39%, 0%, 24%, 16%)
Oklch
oklch(80.9% 0.109 156.0)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#A3B285

Willow Green · DarkSeaGreen · Apple Green

HEX
#A3B285
RGB
rgb(163, 178, 133)
HSL
hsl(80, 23%, 61%)
HSB
hsb(80, 25%, 70%)
CMYK
cmyk(8%, 0%, 25%, 30%)
Oklch
oklch(74.0% 0.064 122.9)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#AF7265

Crimson · Gray · Passion Red

HEX
#AF7265
RGB
rgb(175, 114, 101)
HSL
hsl(11, 32%, 54%)
HSB
hsb(11, 42%, 69%)
CMYK
cmyk(0%, 35%, 42%, 31%)
Oklch
oklch(61.3% 0.080 32.6)

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

#AC3F5A

Crimson · Sienna · Passion Red

HEX
#AC3F5A
RGB
rgb(172, 63, 90)
HSL
hsl(345, 46%, 46%)
HSB
hsb(345, 63%, 67%)
CMYK
cmyk(0%, 63%, 48%, 33%)
Oklch
oklch(52.6% 0.144 8.4)

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

#4E2635

Dark Violet · DarkSlateGray · Raspberry

HEX
#4E2635
RGB
rgb(78, 38, 53)
HSL
hsl(338, 34%, 23%)
HSB
hsb(338, 51%, 31%)
CMYK
cmyk(0%, 51%, 32%, 69%)
Oklch
oklch(32.8% 0.063 357.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

83D6A3
D685B7

Analogous

8ED685
83D6A3
85D6CD

Triadic

83D6A3
A485D6
D6A485

Split-Comp.

83D6A3
CD85D6
D6858E

Tetradic

83D6A3
858ED6
D685B7
D6CD85

Contrast Matrix WCAG 2.1 Contrast

83D6A3
A3B285
AF7265
AC3F5A
4E2635
—
1.3
Fail
2.2
Fail
3.4
AA Large
7.3
AAA
1.3
Fail
—
1.7
Fail
2.6
Fail
5.6
AA
2.2
Fail
1.7
Fail
—
1.5
Fail
3.3
AA Large
3.4
AA Large
2.6
Fail
1.5
Fail
—
2.2
Fail
7.3
AAA
5.6
AA
3.3
AA Large
2.2
Fail
—
White BG
1.7Fail
2.3Fail
3.9AA Large
5.8AA
12.7AAA
Black BG
12.1AAA
9.3AAA
5.4AA
3.6AA Large
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A8AF
A9AA90
959468
7D7C53
3D3C31

Deuteranopia

A29CB2
A9A893
989D69
838B52
3F4230

Tritanopia

87B9BB
A4989A
AC6B6B
A74E4D
4C2F2E

Achromatopsia

B7B7B7
A8A8A8
838383
636363
343434

Shades & Tints Shades & Tints

#83D6A3

Dark
Light

#A3B285

Dark
Light

#AF7265

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #83d6a3;
  --color-2: #a3b285;
  --color-3: #af7265;
  --color-4: #ac3f5a;
  --color-5: #4e2635;
}

SCSS

$color-1: #83d6a3;
$color-2: #a3b285;
$color-3: #af7265;
$color-4: #ac3f5a;
$color-5: #4e2635;

TAILWIND

colors: {
  'brand-1': '#83d6a3',
  'brand-2': '#a3b285',
  'brand-3': '#af7265',
  'brand-4': '#ac3f5a',
  'brand-5': '#4e2635',
}

RGB Array

[131, 214, 163], [163, 178, 133], [175, 114, 101], [172, 63, 90], [78, 38, 53]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #83D6A3, #A3B285, #AF7265, #AC3F5A, #4E2635 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #83d6a3; --color-2: #a3b285; --color-3: #af7265; --color-4: #ac3f5a; --color-5: #4e2635. 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. 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