← Back to Editor

#083240 · #628C76 · #FFF5A7 · #61374F · #1C061D

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

#083240

Lake Blue · DarkSlateGray · Peacock Green

HEX
#083240
RGB
rgb(8, 50, 64)
HSL
hsl(195, 78%, 14%)
HSB
hsb(195, 88%, 25%)
CMYK
cmyk(88%, 22%, 0%, 75%)
Oklch
oklch(29.7% 0.051 225.3)

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

#628C76

Celadon · SlateGray · Olive Green

HEX
#628C76
RGB
rgb(98, 140, 118)
HSL
hsl(149, 18%, 47%)
HSB
hsb(149, 30%, 55%)
CMYK
cmyk(30%, 0%, 16%, 45%)
Oklch
oklch(60.3% 0.057 161.2)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#FFF5A7

Fresh Green · Wheat · Lemon Cream

HEX
#FFF5A7
RGB
rgb(255, 245, 167)
HSL
hsl(53, 100%, 83%)
HSB
hsb(53, 35%, 100%)
CMYK
cmyk(0%, 4%, 35%, 0%)
Oklch
oklch(96.0% 0.098 101.8)

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

#61374F

Rose Purple · DarkSlateGray · Camellia

HEX
#61374F
RGB
rgb(97, 55, 79)
HSL
hsl(326, 28%, 30%)
HSB
hsb(326, 43%, 38%)
CMYK
cmyk(0%, 43%, 19%, 62%)
Oklch
oklch(39.7% 0.069 345.4)

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

#1C061D

Royal Purple · Black · Dark Purple

HEX
#1C061D
RGB
rgb(28, 6, 29)
HSL
hsl(297, 66%, 7%)
HSB
hsb(297, 79%, 11%)
CMYK
cmyk(3%, 79%, 0%, 89%)
Oklch
oklch(17.4% 0.056 326.0)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

083240
401608

Analogous

084032
083240
081640

Triadic

083240
400832
324008

Split-Comp.

083240
400816
403208

Tetradic

083240
320840
401608
164008

Contrast Matrix WCAG 2.1 Contrast

083240
628C76
FFF5A7
61374F
1C061D
—
3.6
AA Large
12.2
AAA
1.4
Fail
1.4
Fail
3.6
AA Large
—
3.4
AA Large
2.6
Fail
5.1
AA
12.2
AAA
3.4
AA Large
—
8.7
AAA
17.3
AAA
1.4
Fail
2.6
Fail
8.7
AAA
—
2.0
Fail
1.4
Fail
5.1
AA
17.3
AAA
2.0
Fail
—
White BG
13.6AAA
3.8AA Large
1.1Fail
9.7AAA
19.2AAA
Black BG
1.5Fail
5.5AA
18.9AAA
2.2Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

1A1B3D
74757B
FBFBBA
4F4E49
121217

Deuteranopia

18153C
726F7D
FBFCBE
515448
141516

Tritanopia

0A3A39
648080
FFC9CC
5F4544
1B1312

Achromatopsia

272727
7D7D7D
EFEFEF
464646
0F0F0F

Shades & Tints Shades & Tints

#083240

Dark
Light

#628C76

Dark
Light

#FFF5A7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #083240;
  --color-2: #628c76;
  --color-3: #fff5a7;
  --color-4: #61374f;
  --color-5: #1c061d;
}

SCSS

$color-1: #083240;
$color-2: #628c76;
$color-3: #fff5a7;
$color-4: #61374f;
$color-5: #1c061d;

TAILWIND

colors: {
  'brand-1': '#083240',
  'brand-2': '#628c76',
  'brand-3': '#fff5a7',
  'brand-4': '#61374f',
  'brand-5': '#1c061d',
}

RGB Array

[8, 50, 64], [98, 140, 118], [255, 245, 167], [97, 55, 79], [28, 6, 29]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #083240, #628C76, #FFF5A7, #61374F, #1C061D is ideal for: tech websites, dark mode UIs, game UIs, 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: #083240; --color-2: #628c76; --color-3: #fff5a7; --color-4: #61374f; --color-5: #1c061d. 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 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