← Back to Editor

#735F43 · #696D73 · #779EE3 · #B8BBD4 · #DAC9C5

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

#735F43

Ochre · DarkOliveGreen · Amber Brown

HEX
#735F43
RGB
rgb(115, 95, 67)
HSL
hsl(35, 26%, 36%)
HSB
hsb(35, 42%, 45%)
CMYK
cmyk(0%, 17%, 42%, 55%)
Oklch
oklch(49.8% 0.049 75.6)

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

#696D73

Ink Gray · DimGray · Warm Gray

HEX
#696D73
RGB
rgb(105, 109, 115)
HSL
hsl(216, 5%, 43%)
HSB
hsb(216, 9%, 45%)
CMYK
cmyk(9%, 5%, 0%, 55%)
Oklch
oklch(53.3% 0.011 258.4)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#779EE3

Azure · CornflowerBlue · Cobalt Blue

HEX
#779EE3
RGB
rgb(119, 158, 227)
HSL
hsl(218, 66%, 68%)
HSB
hsb(218, 48%, 89%)
CMYK
cmyk(48%, 30%, 0%, 11%)
Oklch
oklch(69.9% 0.111 261.4)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#B8BBD4

Azure · LightSteelBlue · Cobalt Blue

HEX
#B8BBD4
RGB
rgb(184, 187, 212)
HSL
hsl(234, 25%, 78%)
HSB
hsb(234, 13%, 83%)
CMYK
cmyk(13%, 12%, 0%, 17%)
Oklch
oklch(79.8% 0.035 280.1)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#DAC9C5

Peach Pink · LightGray · Cherry Blossom

HEX
#DAC9C5
RGB
rgb(218, 201, 197)
HSL
hsl(11, 22%, 81%)
HSB
hsb(11, 10%, 85%)
CMYK
cmyk(0%, 8%, 10%, 15%)
Oklch
oklch(84.9% 0.020 33.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

735F43
445874

Analogous

744844
735F43
707444

Triadic

735F43
447460
604474

Split-Comp.

735F43
447074
484474

Tetradic

735F43
447448
445874
744470

Contrast Matrix WCAG 2.1 Contrast

735F43
696D73
779EE3
B8BBD4
DAC9C5
—
1.2
Fail
2.3
Fail
3.2
AA Large
3.8
AA Large
1.2
Fail
—
1.9
Fail
2.7
Fail
3.3
AA Large
2.3
Fail
1.9
Fail
—
1.4
Fail
1.7
Fail
3.2
AA Large
2.7
Fail
1.4
Fail
—
1.2
Fail
3.8
AA Large
3.3
AA Large
1.7
Fail
1.2
Fail
—
White BG
6.1AA
5.2AA
2.7Fail
1.9Fail
1.6Fail
Black BG
3.4AA Large
4.0AA Large
7.8AAA
11.1AAA
13.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6A6A4A
6B6B72
8888D2
B9B9CE
D3D2C6

Deuteranopia

6C6D4B
6B6A71
8683CE
B9B9CC
D4D5C6

Tritanopia

724F50
697070
79C5C2
B8C9C8
D9C7C7

Achromatopsia

626262
6C6C6C
9A9A9A
BDBDBD
CECECE

Shades & Tints Shades & Tints

#735F43

Dark
Light

#696D73

Dark
Light

#779EE3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #735f43;
  --color-2: #696d73;
  --color-3: #779ee3;
  --color-4: #b8bbd4;
  --color-5: #dac9c5;
}

SCSS

$color-1: #735f43;
$color-2: #696d73;
$color-3: #779ee3;
$color-4: #b8bbd4;
$color-5: #dac9c5;

TAILWIND

colors: {
  'brand-1': '#735f43',
  'brand-2': '#696d73',
  'brand-3': '#779ee3',
  'brand-4': '#b8bbd4',
  'brand-5': '#dac9c5',
}

RGB Array

[115, 95, 67], [105, 109, 115], [119, 158, 227], [184, 187, 212], [218, 201, 197]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #735F43, #696D73, #779EE3, #B8BBD4, #DAC9C5 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: #735f43; --color-2: #696d73; --color-3: #779ee3; --color-4: #b8bbd4; --color-5: #dac9c5. 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