← Back to Editor

#F19F91 · #C9A197 · #BAA19A · #738E89 · #57484D

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

#F19F91

Peach Pink · DarkSalmon · Coral Red

HEX
#F19F91
RGB
rgb(241, 159, 145)
HSL
hsl(9, 77%, 76%)
HSB
hsb(9, 40%, 95%)
CMYK
cmyk(0%, 34%, 40%, 5%)
Oklch
oklch(78.0% 0.101 30.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C9A197

Peach Pink · Tan · Coral Red

HEX
#C9A197
RGB
rgb(201, 161, 151)
HSL
hsl(12, 32%, 69%)
HSB
hsb(12, 25%, 79%)
CMYK
cmyk(0%, 20%, 25%, 21%)
Oklch
oklch(74.3% 0.050 34.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#BAA19A

Peach Pink · DarkGray · Coral Red

HEX
#BAA19A
RGB
rgb(186, 161, 154)
HSL
hsl(13, 19%, 67%)
HSB
hsb(13, 17%, 73%)
CMYK
cmyk(0%, 13%, 17%, 27%)
Oklch
oklch(72.9% 0.031 36.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#738E89

Mineral Blue · SlateGray · Mint Ice

HEX
#738E89
RGB
rgb(115, 142, 137)
HSL
hsl(169, 11%, 50%)
HSB
hsb(169, 19%, 56%)
CMYK
cmyk(19%, 0%, 4%, 44%)
Oklch
oklch(62.4% 0.032 182.8)

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

#57484D

Dark Violet · DarkSlateGray · Charcoal

HEX
#57484D
RGB
rgb(87, 72, 77)
HSL
hsl(340, 9%, 31%)
HSB
hsb(340, 17%, 34%)
CMYK
cmyk(0%, 17%, 11%, 66%)
Oklch
oklch(41.9% 0.022 356.0)

Traditional「Dark Violet」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F19F91
93E3F1

Analogous

F193B4
F19F91
F1D093

Triadic

F19F91
93F1A1
A193F1

Split-Comp.

F19F91
93F1D0
93B4F1

Tetradic

F19F91
B4F193
93E3F1
D093F1

Contrast Matrix WCAG 2.1 Contrast

F19F91
C9A197
BAA19A
738E89
57484D
—
1.1
Fail
1.2
Fail
1.7
Fail
4.1
AA Large
1.1
Fail
—
1.0
Fail
1.5
Fail
3.7
AA Large
1.2
Fail
1.0
Fail
—
1.5
Fail
3.5
AA Large
1.7
Fail
1.5
Fail
1.5
Fail
—
2.4
Fail
4.1
AA Large
3.7
AA Large
3.5
AA Large
2.4
Fail
—
White BG
2.1Fail
2.3Fail
2.4Fail
3.5AA Large
8.6AAA
Black BG
10.1AAA
9.0AAA
8.7AAA
6.0AA
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCD94
B8B799
AFAF9C
7F7F8A
51504C

Deuteranopia

D2D895
BABD9A
B1B39C
7D7B8B
51534C

Tritanopia

ED9798
C79B9C
B99D9D
748B8B
564B4B

Achromatopsia

B6B6B6
ACACAC
A8A8A8
858585
4D4D4D

Shades & Tints Shades & Tints

#F19F91

Dark
Light

#C9A197

Dark
Light

#BAA19A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f19f91;
  --color-2: #c9a197;
  --color-3: #baa19a;
  --color-4: #738e89;
  --color-5: #57484d;
}

SCSS

$color-1: #f19f91;
$color-2: #c9a197;
$color-3: #baa19a;
$color-4: #738e89;
$color-5: #57484d;

TAILWIND

colors: {
  'brand-1': '#f19f91',
  'brand-2': '#c9a197',
  'brand-3': '#baa19a',
  'brand-4': '#738e89',
  'brand-5': '#57484d',
}

RGB Array

[241, 159, 145], [201, 161, 151], [186, 161, 154], [115, 142, 137], [87, 72, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F19F91, #C9A197, #BAA19A, #738E89, #57484D 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: #f19f91; --color-2: #c9a197; --color-3: #baa19a; --color-4: #738e89; --color-5: #57484d. 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