← Back to Editor

#063A45 · #3C8898 · #AD9F92 · #F2B38A · #FFE5B2

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#063A45

Lake Blue · DarkSlateGray · Peacock Green

HEX
#063A45
RGB
rgb(6, 58, 69)
HSL
hsl(190, 84%, 15%)
HSB
hsb(190, 91%, 27%)
CMYK
cmyk(91%, 16%, 0%, 73%)
Oklch
oklch(32.2% 0.054 216.3)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#3C8898

Slate Blue · SteelBlue · Mint Ice

HEX
#3C8898
RGB
rgb(60, 136, 152)
HSL
hsl(190, 43%, 42%)
HSB
hsb(190, 61%, 60%)
CMYK
cmyk(61%, 11%, 0%, 40%)
Oklch
oklch(58.6% 0.078 213.6)

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

#AD9F92

Apricot · DarkGray · Warm Sun

HEX
#AD9F92
RGB
rgb(173, 159, 146)
HSL
hsl(29, 14%, 63%)
HSB
hsb(29, 16%, 68%)
CMYK
cmyk(0%, 8%, 16%, 32%)
Oklch
oklch(71.1% 0.025 65.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#F2B38A

Apricot · BurlyWood · Warm Sun

HEX
#F2B38A
RGB
rgb(242, 179, 138)
HSL
hsl(24, 80%, 75%)
HSB
hsb(24, 43%, 95%)
CMYK
cmyk(0%, 26%, 43%, 5%)
Oklch
oklch(81.6% 0.092 54.1)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FFE5B2

Goose Yellow · Wheat · Lemon Cream

HEX
#FFE5B2
RGB
rgb(255, 229, 178)
HSL
hsl(40, 100%, 85%)
HSB
hsb(40, 30%, 100%)
CMYK
cmyk(0%, 10%, 30%, 0%)
Oklch
oklch(93.1% 0.071 84.0)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

063A45
461106

Analogous

064631
063A45
061C46

Triadic

063A45
46063C
3C4606

Split-Comp.

063A45
46061C
463106

Tetradic

063A45
310646
461106
1C4606

Contrast Matrix WCAG 2.1 Contrast

063A45
3C8898
AD9F92
F2B38A
FFE5B2
—
3.0
AA Large
4.8
AA
6.8
AA
10.1
AAA
3.0
AA Large
—
1.6
Fail
2.2
Fail
3.3
AA Large
4.8
AA
1.6
Fail
—
1.4
Fail
2.1
Fail
6.8
AA
2.2
Fail
1.4
Fail
—
1.5
Fail
10.1
AAA
3.3
AA Large
2.1
Fail
1.5
Fail
—
White BG
12.4AAA
4.1AA Large
2.6Fail
1.8Fail
1.2Fail
Black BG
1.7Fail
5.2AA
8.2AAA
11.6AAA
17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1D42
5D5E94
A7A795
D7D694
F4F4BE

Deuteranopia

1A1642
595393
A8A996
DADF96
F5F7C1

Tritanopia

094040
409190
AC9898
EF9C9D
FEC8CA

Achromatopsia

2C2C2C
737373
A2A2A2
C1C1C1
E7E7E7

Shades & Tints Shades & Tints

#063A45

Dark
Light

#3C8898

Dark
Light

#AD9F92

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #063a45;
  --color-2: #3c8898;
  --color-3: #ad9f92;
  --color-4: #f2b38a;
  --color-5: #ffe5b2;
}

SCSS

$color-1: #063a45;
$color-2: #3c8898;
$color-3: #ad9f92;
$color-4: #f2b38a;
$color-5: #ffe5b2;

TAILWIND

colors: {
  'brand-1': '#063a45',
  'brand-2': '#3c8898',
  'brand-3': '#ad9f92',
  'brand-4': '#f2b38a',
  'brand-5': '#ffe5b2',
}

RGB Array

[6, 58, 69], [60, 136, 152], [173, 159, 146], [242, 179, 138], [255, 229, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #063A45, #3C8898, #AD9F92, #F2B38A, #FFE5B2 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #063a45; --color-2: #3c8898; --color-3: #ad9f92; --color-4: #f2b38a; --color-5: #ffe5b2. 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 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