← Back to Editor

#635B51 · #FF63B9 · #D11F81 · #A6035D · #30051D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#635B51

Ochre · DimGray · Amber Brown

HEX
#635B51
RGB
rgb(99, 91, 81)
HSL
hsl(33, 10%, 35%)
HSB
hsb(33, 18%, 39%)
CMYK
cmyk(0%, 8%, 18%, 61%)
Oklch
oklch(47.6% 0.019 73.5)

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

#FF63B9

Mauve · Orchid · Rose Pink

HEX
#FF63B9
RGB
rgb(255, 99, 185)
HSL
hsl(327, 100%, 69%)
HSB
hsb(327, 61%, 100%)
CMYK
cmyk(0%, 61%, 27%, 0%)
Oklch
oklch(72.3% 0.208 349.4)

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

#D11F81

Rose Purple · MediumVioletRed · Camellia

HEX
#D11F81
RGB
rgb(209, 31, 129)
HSL
hsl(327, 74%, 47%)
HSB
hsb(327, 85%, 82%)
CMYK
cmyk(0%, 85%, 38%, 18%)
Oklch
oklch(57.3% 0.220 354.1)

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

#A6035D

Rose Purple · Purple · Camellia

HEX
#A6035D
RGB
rgb(166, 3, 93)
HSL
hsl(327, 96%, 33%)
HSB
hsb(327, 98%, 65%)
CMYK
cmyk(0%, 98%, 44%, 35%)
Oklch
oklch(47.3% 0.192 357.0)

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

#30051D

Rose Purple · Black · Raspberry

HEX
#30051D
RGB
rgb(48, 5, 29)
HSL
hsl(327, 81%, 10%)
HSB
hsb(327, 90%, 19%)
CMYK
cmyk(0%, 90%, 40%, 81%)
Oklch
oklch(21.2% 0.075 350.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

635B51
505862

Analogous

625150
635B51
616250

Triadic

635B51
50625A
5A5062

Split-Comp.

635B51
506162
515062

Tetradic

635B51
506251
505862
625061

Contrast Matrix WCAG 2.1 Contrast

635B51
FF63B9
D11F81
A6035D
30051D
—
2.5
Fail
1.3
Fail
1.1
Fail
2.7
Fail
2.5
Fail
—
1.8
Fail
2.8
Fail
6.6
AA
1.3
Fail
1.8
Fail
—
1.5
Fail
3.6
AA Large
1.1
Fail
2.8
Fail
1.5
Fail
—
2.4
Fail
2.7
Fail
6.6
AA
3.6
AA Large
2.4
Fail
—
White BG
6.7AA
2.7Fail
5.0AA
7.5AAA
18.0AAA
Black BG
3.1AA Large
7.7AAA
4.2AA Large
2.8Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

605F53
BBBAA4
848269
5F5E47
1D1D17

Deuteranopia

606154
C5D09F
8E9C64
697542
202316

Tritanopia

635556
F79490
C85752
9E3632
2E1312

Achromatopsia

5C5C5C
9B9B9B
5F5F5F
3E3E3E
151515

Shades & Tints Shades & Tints

#635B51

Dark
Light

#FF63B9

Dark
Light

#D11F81

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #635b51;
  --color-2: #ff63b9;
  --color-3: #d11f81;
  --color-4: #a6035d;
  --color-5: #30051d;
}

SCSS

$color-1: #635b51;
$color-2: #ff63b9;
$color-3: #d11f81;
$color-4: #a6035d;
$color-5: #30051d;

TAILWIND

colors: {
  'brand-1': '#635b51',
  'brand-2': '#ff63b9',
  'brand-3': '#d11f81',
  'brand-4': '#a6035d',
  'brand-5': '#30051d',
}

RGB Array

[99, 91, 81], [255, 99, 185], [209, 31, 129], [166, 3, 93], [48, 5, 29]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #635B51, #FF63B9, #D11F81, #A6035D, #30051D is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #635b51; --color-2: #ff63b9; --color-3: #d11f81; --color-4: #a6035d; --color-5: #30051d. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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