← Back to Editor

#968567 · #4B3B2E · #DD0960 · #F63E7E · #F1F5F4

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

#968567

Ochre · Gray · Amber Brown

HEX
#968567
RGB
rgb(150, 133, 103)
HSL
hsl(38, 19%, 50%)
HSB
hsb(38, 31%, 59%)
CMYK
cmyk(0%, 11%, 31%, 41%)
Oklch
oklch(62.4% 0.047 81.7)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#4B3B2E

Tangerine · DarkSlateGray · Cinnamon

HEX
#4B3B2E
RGB
rgb(75, 59, 46)
HSL
hsl(27, 24%, 24%)
HSB
hsb(27, 39%, 29%)
CMYK
cmyk(0%, 21%, 39%, 71%)
Oklch
oklch(36.6% 0.031 60.7)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#DD0960

Dark Violet · Crimson · Camellia

HEX
#DD0960
RGB
rgb(221, 9, 96)
HSL
hsl(335, 92%, 45%)
HSB
hsb(335, 96%, 87%)
CMYK
cmyk(0%, 96%, 57%, 13%)
Oklch
oklch(57.7% 0.228 7.8)

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

#F63E7E

Dark Violet · DeepPink · Rose Pink

HEX
#F63E7E
RGB
rgb(246, 62, 126)
HSL
hsl(339, 91%, 60%)
HSB
hsb(339, 75%, 96%)
CMYK
cmyk(0%, 75%, 49%, 4%)
Oklch
oklch(65.5% 0.222 5.2)

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

#F1F5F4

Jade · SeaShell · Glacier Blue

HEX
#F1F5F4
RGB
rgb(241, 245, 244)
HSL
hsl(165, 17%, 95%)
HSB
hsb(165, 2%, 96%)
CMYK
cmyk(2%, 0%, 0%, 4%)
Oklch
oklch(96.7% 0.004 179.7)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

968567
677998

Analogous

986E67
968567
919867

Triadic

968567
679886
866798

Split-Comp.

968567
679198
6E6798

Tetradic

968567
67986E
677998
986791

Contrast Matrix WCAG 2.1 Contrast

968567
4B3B2E
DD0960
F63E7E
F1F5F4
—
3.0
Fail
1.4
Fail
1.0
Fail
3.3
AA Large
3.0
Fail
—
2.2
Fail
3.0
AA Large
9.7
AAA
1.4
Fail
2.2
Fail
—
1.4
Fail
4.5
AA Large
1.0
Fail
3.0
AA Large
1.4
Fail
—
3.2
AA Large
3.3
AA Large
9.7
AAA
4.5
AA Large
3.2
AA Large
—
White BG
3.6AA Large
10.7AAA
4.9AA
3.6AA Large
1.1Fail
Black BG
5.8AA
2.0Fail
4.3AA Large
5.9AA
19.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8E6E
444431
817F4B
A6A56F
F3F3F4

Deuteranopia

909170
454632
8E9D46
B1BF6B
F3F2F4

Tritanopia

957475
4A3434
D23A37
ED6260
F1F4F4

Achromatopsia

878787
3E3E3E
525252
7C7C7C
F4F4F4

Shades & Tints Shades & Tints

#968567

Dark
Light

#4B3B2E

Dark
Light

#DD0960

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #968567;
  --color-2: #4b3b2e;
  --color-3: #dd0960;
  --color-4: #f63e7e;
  --color-5: #f1f5f4;
}

SCSS

$color-1: #968567;
$color-2: #4b3b2e;
$color-3: #dd0960;
$color-4: #f63e7e;
$color-5: #f1f5f4;

TAILWIND

colors: {
  'brand-1': '#968567',
  'brand-2': '#4b3b2e',
  'brand-3': '#dd0960',
  'brand-4': '#f63e7e',
  'brand-5': '#f1f5f4',
}

RGB Array

[150, 133, 103], [75, 59, 46], [221, 9, 96], [246, 62, 126], [241, 245, 244]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #968567, #4B3B2E, #DD0960, #F63E7E, #F1F5F4 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: #968567; --color-2: #4b3b2e; --color-3: #dd0960; --color-4: #f63e7e; --color-5: #f1f5f4. 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