← Back to Editor

#A8C0C0 · #90A8A8 · #789090 · #604848 · #481818

summer

A 5-color summer 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

#A8C0C0

Sky Blue · Silver · Lake Green

HEX
#A8C0C0
RGB
rgb(168, 192, 192)
HSL
hsl(180, 16%, 71%)
HSB
hsb(180, 13%, 75%)
CMYK
cmyk(13%, 0%, 0%, 25%)
Oklch
oklch(79.0% 0.026 196.6)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#90A8A8

Sky Blue · DarkGray · Lake Green

HEX
#90A8A8
RGB
rgb(144, 168, 168)
HSL
hsl(180, 12%, 61%)
HSB
hsb(180, 14%, 66%)
CMYK
cmyk(14%, 0%, 0%, 34%)
Oklch
oklch(71.3% 0.027 196.6)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#789090

Slate Blue · LightSlateGray · Lake Green

HEX
#789090
RGB
rgb(120, 144, 144)
HSL
hsl(180, 10%, 52%)
HSB
hsb(180, 17%, 56%)
CMYK
cmyk(17%, 0%, 0%, 44%)
Oklch
oklch(63.5% 0.027 196.5)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#604848

Crimson · DarkOliveGreen · Wine Red

HEX
#604848
RGB
rgb(96, 72, 72)
HSL
hsl(0, 14%, 33%)
HSB
hsb(0, 25%, 38%)
CMYK
cmyk(0%, 25%, 25%, 62%)
Oklch
oklch(42.7% 0.033 18.5)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#481818

Crimson · Maroon · Deep Berry

HEX
#481818
RGB
rgb(72, 24, 24)
HSL
hsl(0, 50%, 19%)
HSB
hsb(0, 67%, 28%)
CMYK
cmyk(0%, 67%, 67%, 72%)
Oklch
oklch(28.5% 0.074 23.0)

TraditionalCrimson」· PaintDeep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A8C0C0
C1A9A9

Analogous

A9C1B5
A8C0C0
A9B5C1

Triadic

A8C0C0
C1A9C1
C1C1A9

Split-Comp.

A8C0C0
C1A9B5
C1B5A9

Tetradic

A8C0C0
B5A9C1
C1A9A9
B5C1A9

Contrast Matrix WCAG 2.1 Contrast

A8C0C0
90A8A8
789090
604848
481818
1.3
Fail
1.8
Fail
4.4
AA Large
7.7
AAA
1.3
Fail
1.3
Fail
3.3
AA Large
5.9
AA
1.8
Fail
1.3
Fail
2.5
Fail
4.4
AA Large
4.4
AA Large
3.3
AA Large
2.5
Fail
1.8
Fail
7.7
AAA
5.9
AA
4.4
AA Large
1.8
Fail
White BG
1.9Fail
2.5Fail
3.4AA Large
8.3AAA
14.8AAA
Black BG
11.0AAA
8.4AAA
6.2AA
2.5Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B2B3C0
9A9BA8
828390
565548
333318

Deuteranopia

B1AFC0
9997A8
817F90
575948
363A18

Tritanopia

A9C0C0
91A8A8
799090
5F4848
461818

Achromatopsia

B9B9B9
A1A1A1
898989
4F4F4F
262626

Shades & Tints Shades & Tints

#A8C0C0

Dark
Light

#90A8A8

Dark
Light

#789090

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a8c0c0;
  --color-2: #90a8a8;
  --color-3: #789090;
  --color-4: #604848;
  --color-5: #481818;
}

SCSS

$color-1: #a8c0c0;
$color-2: #90a8a8;
$color-3: #789090;
$color-4: #604848;
$color-5: #481818;

TAILWIND

colors: {
  'brand-1': '#a8c0c0',
  'brand-2': '#90a8a8',
  'brand-3': '#789090',
  'brand-4': '#604848',
  'brand-5': '#481818',
}

RGB Array

[168, 192, 192], [144, 168, 168], [120, 144, 144], [96, 72, 72], [72, 24, 24]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #A8C0C0, #90A8A8, #789090, #604848, #481818 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: #a8c0c0; --color-2: #90a8a8; --color-3: #789090; --color-4: #604848; --color-5: #481818. 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 summer-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