#0A5D6D + #376161 + #656455 + #926849 + #BF6B3D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0A5D6D

Lake Blue · Teal · Peacock Green

HEX

#0A5D6D

RGB

rgb(10, 93, 109)

HSL

hsl(190, 83%, 23%)

HSB

hsb(190, 91%, 43%)

CMYK

cmyk(91%, 15%, 0%, 57%)

Oklch

oklch(44.1% 0.075 215.4)

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

#376161

Slate Blue · DarkSlateGray · Mint Ice

HEX

#376161

RGB

rgb(55, 97, 97)

HSL

hsl(180, 28%, 30%)

HSB

hsb(180, 43%, 38%)

CMYK

cmyk(43%, 0%, 0%, 62%)

Oklch

oklch(46.2% 0.047 195.6)

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

#656455

Autumn Sage · DimGray · Charcoal

HEX

#656455

RGB

rgb(101, 100, 85)

HSL

hsl(56, 9%, 36%)

HSB

hsb(56, 16%, 40%)

CMYK

cmyk(0%, 1%, 16%, 60%)

Oklch

oklch(50.0% 0.023 104.1)

Traditional「Autumn Sage」· Paint「Charcoal」· Creative Midnight Shadow

#926849

Tangerine · Sienna · Amber Brown

HEX

#926849

RGB

rgb(146, 104, 73)

HSL

hsl(25, 33%, 43%)

HSB

hsb(25, 50%, 57%)

CMYK

cmyk(0%, 29%, 50%, 43%)

Oklch

oklch(55.3% 0.070 57.1)

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

#BF6B3D

Tangerine · Chocolate · Amber Brown

HEX

#BF6B3D

RGB

rgb(191, 107, 61)

HSL

hsl(21, 52%, 49%)

HSB

hsb(21, 68%, 75%)

CMYK

cmyk(0%, 44%, 68%, 25%)

Oklch

oklch(61.4% 0.123 47.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0A5D6D

6B1A0A

Analogous

0A6B4B

0A5D6D

0A2A6B

Triadic

0A5D6D

6B0A5B

5B6B0A

Split-Comp.

0A5D6D

6B0A2A

6B4B0A

Tetradic

0A5D6D

4B0A6B

6B1A0A

2A6B0A

Contrast Matrix WCAG 2.1 Contrast

0A5D6D	376161	656455	926849	BF6B3D
—	1.1 Fail	1.3 Fail	1.5 Fail	1.9 Fail
1.1 Fail	—	1.2 Fail	1.4 Fail	1.8 Fail
1.3 Fail	1.2 Fail	—	1.2 Fail	1.5 Fail
1.5 Fail	1.4 Fail	1.2 Fail	—	1.3 Fail
1.9 Fail	1.8 Fail	1.5 Fail	1.3 Fail	—

White BG

7.5AAA

6.9AA

6.0AA

4.9AA

3.9AA Large

Black BG

2.8Fail

3.0AA Large

3.5AA Large

4.3AA Large

5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2F69

494A61

656559

807F51

9B9A48

Deuteranopia

292368

474461

65655A

828552

A0A64B

Tritanopia

0E6665

396161

655B5C

905658

BB5153

Achromatopsia

464646

545454

636363

717171

7F7F7F

Shades & Tints Shades & Tints

#0A5D6D

Dark

Light

#376161

Dark

Light

#656455

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0a5d6d;
  --color-2: #376161;
  --color-3: #656455;
  --color-4: #926849;
  --color-5: #bf6b3d;
}

SCSS

$color-1: #0a5d6d;
$color-2: #376161;
$color-3: #656455;
$color-4: #926849;
$color-5: #bf6b3d;

TAILWIND

colors: {
  'brand-1': '#0a5d6d',
  'brand-2': '#376161',
  'brand-3': '#656455',
  'brand-4': '#926849',
  'brand-5': '#bf6b3d',
}

RGB Array

[10, 93, 109], [55, 97, 97], [101, 100, 85], [146, 104, 73], [191, 107, 61]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0A5D6D, #376161, #656455, #926849, #BF6B3D is ideal for: tech websites, dark mode UIs, game UIs. 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: #0a5d6d; --color-2: #376161; --color-3: #656455; --color-4: #926849; --color-5: #bf6b3d. 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. 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