← Back to Editor

#A26174 · #DE789E · #FEF4DF · #CB7FB8

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#A26174

Dark Violet · Gray · Rose Pink

HEX
#A26174
RGB
rgb(162, 97, 116)
HSL
hsl(342, 26%, 51%)
HSB
hsb(342, 40%, 64%)
CMYK
cmyk(0%, 40%, 28%, 36%)
Oklch
oklch(57.0% 0.087 1.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#DE789E

Rouge · LightCoral · Rose Pink

HEX
#DE789E
RGB
rgb(222, 120, 158)
HSL
hsl(338, 61%, 67%)
HSB
hsb(338, 46%, 87%)
CMYK
cmyk(0%, 46%, 29%, 13%)
Oklch
oklch(69.7% 0.133 357.4)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#FEF4DF

Goose Yellow · Linen · Lemon Cream

HEX
#FEF4DF
RGB
rgb(254, 244, 223)
HSL
hsl(41, 94%, 94%)
HSB
hsb(41, 12%, 100%)
CMYK
cmyk(0%, 4%, 12%, 0%)
Oklch
oklch(96.9% 0.030 85.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#CB7FB8

Mauve · Orchid · Lilac Purple

HEX
#CB7FB8
RGB
rgb(203, 127, 184)
HSL
hsl(315, 42%, 65%)
HSB
hsb(315, 37%, 80%)
CMYK
cmyk(0%, 37%, 9%, 20%)
Oklch
oklch(69.4% 0.119 336.5)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A26174
62A38F

Analogous

A36296
A26174
A36F62

Triadic

A26174
75A362
6275A3

Split-Comp.

A26174
62A36F
6296A3

Tetradic

A26174
96A362
62A38F
6F62A3

Contrast Matrix WCAG 2.1 Contrast

A26174
DE789E
FEF4DF
CB7FB8
—
1.6
Fail
4.3
AA Large
1.6
Fail
1.6
Fail
—
2.6
Fail
1.0
Fail
4.3
AA Large
2.6
Fail
—
2.6
Fail
1.6
Fail
1.0
Fail
2.6
Fail
—
White BG
4.7AA
2.9Fail
1.1Fail
2.9Fail
Black BG
4.5AA Large
7.3AAA
19.2AAA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86856F
B2B195
FAFAE4
AAA9AA

Deuteranopia

8A8F6E
B8BF93
FAFBE5
AFB4A7

Tritanopia

9F6C6B
D98E8C
FDE8E9
C79F9D

Achromatopsia

777777
9B9B9B
F5F5F5
9C9C9C

Shades & Tints Shades & Tints

#A26174

Dark
Light

#DE789E

Dark
Light

#FEF4DF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a26174;
  --color-2: #de789e;
  --color-3: #fef4df;
  --color-4: #cb7fb8;
}

SCSS

$color-1: #a26174;
$color-2: #de789e;
$color-3: #fef4df;
$color-4: #cb7fb8;

TAILWIND

colors: {
  'brand-1': '#a26174',
  'brand-2': '#de789e',
  'brand-3': '#fef4df',
  'brand-4': '#cb7fb8',
}

RGB Array

[162, 97, 116], [222, 120, 158], [254, 244, 223], [203, 127, 184]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This general-style palette of #A26174, #DE789E, #FEF4DF, #CB7FB8 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #a26174; --color-2: #de789e; --color-3: #fef4df; --color-4: #cb7fb8. 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. 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 4-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