← Back to Editor

#B163A3 · #FAFFE6 · #CCDC7C · #164B5B · #6D2961

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

#B163A3

Rose Purple · MediumOrchid · Violet

HEX
#B163A3
RGB
rgb(177, 99, 163)
HSL
hsl(311, 33%, 54%)
HSB
hsb(311, 44%, 69%)
CMYK
cmyk(0%, 44%, 8%, 31%)
Oklch
oklch(61.0% 0.130 334.0)

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

#FAFFE6

Willow Green · LightYellow · Mint Green

HEX
#FAFFE6
RGB
rgb(250, 255, 230)
HSL
hsl(72, 100%, 95%)
HSB
hsb(72, 10%, 100%)
CMYK
cmyk(2%, 0%, 10%, 0%)
Oklch
oklch(99.0% 0.033 116.2)

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

#CCDC7C

Willow Green · Khaki · Apple Green

HEX
#CCDC7C
RGB
rgb(204, 220, 124)
HSL
hsl(70, 58%, 67%)
HSB
hsb(70, 44%, 86%)
CMYK
cmyk(7%, 0%, 44%, 14%)
Oklch
oklch(86.1% 0.122 116.8)

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

#164B5B

Lake Blue · DarkSlateGray · Peacock Green

HEX
#164B5B
RGB
rgb(22, 75, 91)
HSL
hsl(194, 61%, 22%)
HSB
hsb(194, 76%, 36%)
CMYK
cmyk(76%, 18%, 0%, 64%)
Oklch
oklch(38.6% 0.060 221.9)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#6D2961

Rose Purple · Purple · Eggplant

HEX
#6D2961
RGB
rgb(109, 41, 97)
HSL
hsl(311, 45%, 29%)
HSB
hsb(311, 62%, 43%)
CMYK
cmyk(0%, 62%, 11%, 57%)
Oklch
oklch(40.1% 0.120 335.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B163A3
63B071

Analogous

9863B0
B163A3
B0637C

Triadic

B163A3
A2B063
63A2B0

Split-Comp.

B163A3
7CB063
63B098

Tetradic

B163A3
B09863
63B071
637CB0

Contrast Matrix WCAG 2.1 Contrast

B163A3
FAFFE6
CCDC7C
164B5B
6D2961
—
4.0
AA Large
2.7
Fail
2.4
Fail
2.4
Fail
4.0
AA Large
—
1.5
Fail
9.4
AAA
9.6
AAA
2.7
Fail
1.5
Fail
—
6.4
AA
6.6
AA
2.4
Fail
9.4
AAA
6.4
AA
—
1.0
Fail
2.4
Fail
9.6
AAA
6.6
AA
1.0
Fail
—
White BG
4.1AA Large
1.0Fail
1.5Fail
9.6AAA
9.8AAA
Black BG
5.2AA
20.5AAA
14.1AAA
2.2Fail
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8F94
FCFCEC
D3D393
2D2D57
504F53

Deuteranopia

949A90
FCFCEE
D2D199
2A2656
545950

Tritanopia

AD8785
FAF1F2
CDA6AA
195453
6A4946

Achromatopsia

828282
FBFBFB
CCCCCC
3D3D3D
444444

Shades & Tints Shades & Tints

#B163A3

Dark
Light

#FAFFE6

Dark
Light

#CCDC7C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b163a3;
  --color-2: #faffe6;
  --color-3: #ccdc7c;
  --color-4: #164b5b;
  --color-5: #6d2961;
}

SCSS

$color-1: #b163a3;
$color-2: #faffe6;
$color-3: #ccdc7c;
$color-4: #164b5b;
$color-5: #6d2961;

TAILWIND

colors: {
  'brand-1': '#b163a3',
  'brand-2': '#faffe6',
  'brand-3': '#ccdc7c',
  'brand-4': '#164b5b',
  'brand-5': '#6d2961',
}

RGB Array

[177, 99, 163], [250, 255, 230], [204, 220, 124], [22, 75, 91], [109, 41, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B163A3, #FAFFE6, #CCDC7C, #164B5B, #6D2961 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: #b163a3; --color-2: #faffe6; --color-3: #ccdc7c; --color-4: #164b5b; --color-5: #6d2961. 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