← Back to Editor

#0F0F0F · #F76896 · #D393DD · #F1DED4 · #F3EDE4

A 5-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

#0F0F0F

Ink Black · Black · Jet Black

HEX
#0F0F0F
RGB
rgb(15, 15, 15)
HSL
hsl(0, 0%, 6%)
HSB
hsb(0, 0%, 6%)
CMYK
cmyk(0%, 0%, 0%, 94%)
Oklch
oklch(16.8% 0.000 89.9)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#F76896

Rouge · LightCoral · Rose Pink

HEX
#F76896
RGB
rgb(247, 104, 150)
HSL
hsl(341, 90%, 69%)
HSB
hsb(341, 58%, 97%)
CMYK
cmyk(0%, 58%, 39%, 3%)
Oklch
oklch(70.6% 0.180 2.8)

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

#D393DD

Lilac · Violet · Lilac Purple

HEX
#D393DD
RGB
rgb(211, 147, 221)
HSL
hsl(292, 52%, 72%)
HSB
hsb(292, 33%, 87%)
CMYK
cmyk(5%, 33%, 0%, 13%)
Oklch
oklch(75.1% 0.124 321.9)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#F1DED4

Apricot · Bisque · Peach Orange

HEX
#F1DED4
RGB
rgb(241, 222, 212)
HSL
hsl(21, 51%, 89%)
HSB
hsb(21, 12%, 95%)
CMYK
cmyk(0%, 8%, 12%, 5%)
Oklch
oklch(91.3% 0.025 49.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F3EDE4

Goose Yellow · Linen · Peach Orange

HEX
#F3EDE4
RGB
rgb(243, 237, 228)
HSL
hsl(36, 38%, 92%)
HSB
hsb(36, 6%, 95%)
CMYK
cmyk(0%, 2%, 6%, 5%)
Oklch
oklch(94.8% 0.014 78.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0F0F0F
0F0F0F

Analogous

0F0F0F
0F0F0F
0F0F0F

Triadic

0F0F0F
0F0F0F
0F0F0F

Split-Comp.

0F0F0F
0F0F0F
0F0F0F

Tetradic

0F0F0F
0F0F0F
0F0F0F
0F0F0F

Contrast Matrix WCAG 2.1 Contrast

0F0F0F
F76896
D393DD
F1DED4
F3EDE4
—
6.7
AA
8.2
AAA
14.7
AAA
16.5
AAA
6.7
AA
—
1.2
Fail
2.2
Fail
2.4
Fail
8.2
AAA
1.2
Fail
—
1.8
Fail
2.0
Fail
14.7
AAA
2.2
Fail
1.8
Fail
—
1.1
Fail
16.5
AAA
2.4
Fail
2.0
Fail
1.1
Fail
—
White BG
19.2AAA
2.8Fail
2.3Fail
1.3Fail
1.2Fail
Black BG
1.1Fail
7.4AAA
9.0AAA
16.1AAA
18.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0F0F0F
B9B88B
B7B7CB
E9E9D6
F0F0E6

Deuteranopia

0F0F0F
C1CC88
BBC0C7
EAEBD7
F1F1E7

Tritanopia

0F0F0F
F08280
D0BDBA
F0D8D9
F3E8E8

Achromatopsia

0F0F0F
989898
AFAFAF
E3E3E3
EEEEEE

Shades & Tints Shades & Tints

#0F0F0F

Dark
Light

#F76896

Dark
Light

#D393DD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0f0f0f;
  --color-2: #f76896;
  --color-3: #d393dd;
  --color-4: #f1ded4;
  --color-5: #f3ede4;
}

SCSS

$color-1: #0f0f0f;
$color-2: #f76896;
$color-3: #d393dd;
$color-4: #f1ded4;
$color-5: #f3ede4;

TAILWIND

colors: {
  'brand-1': '#0f0f0f',
  'brand-2': '#f76896',
  'brand-3': '#d393dd',
  'brand-4': '#f1ded4',
  'brand-5': '#f3ede4',
}

RGB Array

[15, 15, 15], [247, 104, 150], [211, 147, 221], [241, 222, 212], [243, 237, 228]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0F0F0F, #F76896, #D393DD, #F1DED4, #F3EDE4 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 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #0f0f0f; --color-2: #f76896; --color-3: #d393dd; --color-4: #f1ded4; --color-5: #f3ede4. 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 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