← Back to Editor

#30263F · #A84A66 · #AF8A7C · #B3B08D · #7DC0AF

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

#30263F

Deep Indigo · DarkSlateGray · Dark Purple

HEX
#30263F
RGB
rgb(48, 38, 63)
HSL
hsl(264, 25%, 20%)
HSB
hsb(264, 40%, 25%)
CMYK
cmyk(24%, 40%, 0%, 75%)
Oklch
oklch(29.2% 0.046 302.0)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#A84A66

Dark Violet · Sienna · Camellia

HEX
#A84A66
RGB
rgb(168, 74, 102)
HSL
hsl(342, 39%, 47%)
HSB
hsb(342, 56%, 66%)
CMYK
cmyk(0%, 56%, 39%, 34%)
Oklch
oklch(53.8% 0.127 3.6)

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

#AF8A7C

Tangerine · Gray · Warm Sun

HEX
#AF8A7C
RGB
rgb(175, 138, 124)
HSL
hsl(16, 24%, 59%)
HSB
hsb(16, 29%, 69%)
CMYK
cmyk(0%, 21%, 29%, 31%)
Oklch
oklch(66.5% 0.050 41.7)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#B3B08D

Fresh Green · DarkGray · Sunflower

HEX
#B3B08D
RGB
rgb(179, 176, 141)
HSL
hsl(55, 20%, 63%)
HSB
hsb(55, 21%, 70%)
CMYK
cmyk(0%, 2%, 21%, 30%)
Oklch
oklch(75.0% 0.048 103.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#7DC0AF

Jade · MediumAquaMarine · Lake Green

HEX
#7DC0AF
RGB
rgb(125, 192, 175)
HSL
hsl(165, 35%, 62%)
HSB
hsb(165, 35%, 75%)
CMYK
cmyk(35%, 0%, 9%, 25%)
Oklch
oklch(75.8% 0.073 176.5)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

30263F
364026

Analogous

262940
30263F
3D2640

Triadic

30263F
403026
264030

Split-Comp.

30263F
403D26
294026

Tetradic

30263F
402629
364026
26403D

Contrast Matrix WCAG 2.1 Contrast

30263F
A84A66
AF8A7C
B3B08D
7DC0AF
—
2.6
Fail
4.6
AA
6.4
AA
6.8
AA
2.6
Fail
—
1.8
Fail
2.5
Fail
2.6
Fail
4.6
AA
1.8
Fail
—
1.4
Fail
1.5
Fail
6.4
AA
2.5
Fail
1.4
Fail
—
1.1
Fail
6.8
AA
2.6
Fail
1.5
Fail
1.1
Fail
—
White BG
14.2AAA
5.5AA
3.1AA Large
2.2Fail
2.1Fail
Black BG
1.5Fail
3.8AA Large
6.7AA
9.5AAA
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2C39
7F7E5F
9F9F7F
B2B295
9A9BB3

Deuteranopia

2C2D37
858C5E
A1A480
B2B298
9691B4

Tritanopia

2F3433
A35A59
AD8283
B39C9E
80B6B7

Achromatopsia

2C2C2C
696969
939393
ADADAD
AAAAAA

Shades & Tints Shades & Tints

#30263F

Dark
Light

#A84A66

Dark
Light

#AF8A7C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #30263f;
  --color-2: #a84a66;
  --color-3: #af8a7c;
  --color-4: #b3b08d;
  --color-5: #7dc0af;
}

SCSS

$color-1: #30263f;
$color-2: #a84a66;
$color-3: #af8a7c;
$color-4: #b3b08d;
$color-5: #7dc0af;

TAILWIND

colors: {
  'brand-1': '#30263f',
  'brand-2': '#a84a66',
  'brand-3': '#af8a7c',
  'brand-4': '#b3b08d',
  'brand-5': '#7dc0af',
}

RGB Array

[48, 38, 63], [168, 74, 102], [175, 138, 124], [179, 176, 141], [125, 192, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #30263F, #A84A66, #AF8A7C, #B3B08D, #7DC0AF 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: #30263f; --color-2: #a84a66; --color-3: #af8a7c; --color-4: #b3b08d; --color-5: #7dc0af. 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