← Back to Editor

#A167B8 · #237F99 · #D12AB3 · #B466BA · #6A0C87

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 Library

Color Details Color Details

#A167B8

Dark Plum · MediumOrchid · Violet

HEX
#A167B8
RGB
rgb(161, 103, 184)
HSL
hsl(283, 36%, 56%)
HSB
hsb(283, 44%, 72%)
CMYK
cmyk(13%, 44%, 0%, 28%)
Oklch
oklch(60.7% 0.134 315.8)

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

#237F99

Lake Blue · Teal · Mint Ice

HEX
#237F99
RGB
rgb(35, 127, 153)
HSL
hsl(193, 63%, 37%)
HSB
hsb(193, 77%, 60%)
CMYK
cmyk(77%, 17%, 0%, 40%)
Oklch
oklch(55.6% 0.091 221.3)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#D12AB3

Rose Purple · MediumVioletRed · Violet

HEX
#D12AB3
RGB
rgb(209, 42, 179)
HSL
hsl(311, 67%, 49%)
HSB
hsb(311, 80%, 82%)
CMYK
cmyk(0%, 80%, 14%, 18%)
Oklch
oklch(60.1% 0.239 336.9)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#B466BA

Dark Plum · MediumOrchid · Violet

HEX
#B466BA
RGB
rgb(180, 102, 186)
HSL
hsl(296, 38%, 56%)
HSB
hsb(296, 45%, 73%)
CMYK
cmyk(3%, 45%, 0%, 27%)
Oklch
oklch(62.9% 0.148 324.5)

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

#6A0C87

Royal Purple · Purple · Eggplant

HEX
#6A0C87
RGB
rgb(106, 12, 135)
HSL
hsl(286, 84%, 29%)
HSB
hsb(286, 91%, 53%)
CMYK
cmyk(21%, 91%, 0%, 47%)
Oklch
oklch(39.5% 0.185 315.6)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A167B8
7DB766

Analogous

7866B7
A167B8
B766A6

Triadic

A167B8
B7A066
66B7A0

Split-Comp.

A167B8
A6B766
66B778

Tetradic

A167B8
B77866
7DB766
66A6B7

Contrast Matrix WCAG 2.1 Contrast

A167B8
237F99
D12AB3
B466BA
6A0C87
—
1.1
Fail
1.1
Fail
1.1
Fail
2.6
Fail
1.1
Fail
—
1.0
Fail
1.2
Fail
2.3
Fail
1.1
Fail
1.0
Fail
—
1.2
Fail
2.3
Fail
1.1
Fail
1.2
Fail
1.2
Fail
—
2.8
Fail
2.6
Fail
2.3
Fail
2.3
Fail
2.8
Fail
—
White BG
4.1AA Large
4.6AA
4.5AA Large
3.8AA Large
10.4AAA
Black BG
5.1AA
4.6AA
4.7AA
5.6AA
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8887A4
4B4C93
898792
9292A6
414069

Deuteranopia

8B90A0
463F91
929F8A
979DA1
474E62

Tritanopia

9E9592
288E8D
C97872
B09692
65524D

Achromatopsia

828282
666666
6C6C6C
878787
363636

Shades & Tints Shades & Tints

#A167B8

Dark
Light

#237F99

Dark
Light

#D12AB3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a167b8;
  --color-2: #237f99;
  --color-3: #d12ab3;
  --color-4: #b466ba;
  --color-5: #6a0c87;
}

SCSS

$color-1: #a167b8;
$color-2: #237f99;
$color-3: #d12ab3;
$color-4: #b466ba;
$color-5: #6a0c87;

TAILWIND

colors: {
  'brand-1': '#a167b8',
  'brand-2': '#237f99',
  'brand-3': '#d12ab3',
  'brand-4': '#b466ba',
  'brand-5': '#6a0c87',
}

RGB Array

[161, 103, 184], [35, 127, 153], [209, 42, 179], [180, 102, 186], [106, 12, 135]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A167B8, #237F99, #D12AB3, #B466BA, #6A0C87 is ideal for: corporate websites, product showcases, portfolios. 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: #a167b8; --color-2: #237f99; --color-3: #d12ab3; --color-4: #b466ba; --color-5: #6a0c87. 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. 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