Back to palettes

Palette

Ceramic Glaze Wash

Delicate blues and greys create a harmonious flow, like a soft, translucent glaze on pottery.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ceramic Glaze Wash reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Ceramic Glaze Wash.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#B0C4DE#A5C0D8#778899#ADD8E6#E0FFFF

Palette guide

How to use Ceramic Glaze Wash

Overview

The "Ceramic Glaze Wash" palette features delicate blues and grays that create a harmonious flow, like a soft, translucent glaze on pottery. It combines the serene #B0C4DE and the slightly richer #A5C0D8, grounding itself with the solid #778899. The palette brightens with the airy #ADD8E6 and the almost translucent #E0FFFF, evoking a sense of calm and artisanal craftsmanship. This collection is ideal for designers seeking to convey tranquility, understated elegance, or natural beauty. Developers can leverage these hues for refreshing user interfaces in wellness, home decor, or craft-oriented applications, ensuring a smooth and inviting visual experience.

Best used for

  • Home decor e-commerce
  • Spa and meditation app interfaces
  • Artisan craft websites
  • Minimalist brand identity
  • Coastal-themed marketing
  • Clean corporate designs

Suggested color roles

primary

#B0C4DE - A soft blue-gray, ideal for main content areas, navigation, or foundational UI elements, conveying calm.

secondary

#A5C0D8 - A slightly deeper blue-gray, excellent for subheadings, borders, or secondary content blocks, adding subtle depth.

accent

#ADD8E6 - A light powder blue, perfect for subtle highlights, interactive elements, or decorative accents.

background

#E0FFFF - A very light aqua, serving as a clean, airy, and expansive canvas for content.

text

#778899 - A solid slate gray, providing good contrast and readability for text on lighter backgrounds like #E0FFFF.

Accessibility notes

  • Ensure #778899 text on #E0FFFF or #ADD8E6 backgrounds meets WCAG contrast standards.
  • Avoid using #ADD8E6 or #B0C4DE for small text against similarly light backgrounds due to low contrast.
  • The darkest color, #778899, provides good contrast for white or very light text.
  • For body text, prefer #778899 against the lightest colors for optimal readability.

Recommended combinations

Soft Flow

Creates a gentle, flowing gradient, ideal for serene backgrounds or large sections.

#E0FFFF · #ADD8E6 · #B0C4DE

Crafted Depth

Excellent for card designs or layered UI, with the darkest color grounding the composition.

#778899 · #A5C0D8 · #E0FFFF

Glaze Accent

Ideal for featuring elements, using the lightest blue as an accent against a primary blue-gray.

#B0C4DE · #ADD8E6 · #778899

CSS variables

:root {
  --ceramic-glaze-wash-1: #B0C4DE;
  --ceramic-glaze-wash-2: #A5C0D8;
  --ceramic-glaze-wash-3: #778899;
  --ceramic-glaze-wash-4: #ADD8E6;
  --ceramic-glaze-wash-5: #E0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ceramic-glaze-wash": {
        1: "#B0C4DE",
        2: "#A5C0D8",
        3: "#778899",
        4: "#ADD8E6",
        5: "#E0FFFF",
      }
    }
  }
}

Related searches

soft blue gray paletteceramic wash colorscalm cool tonessubtle craft designserene web ui colors

Palette colors

Hex values

Color 1#B0C4DE
·
Color 2#A5C0D8
·
Color 3#778899
·
Color 4#ADD8E6
·
Color 5#E0FFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
2:1Fail
1.2:1Fail
1.7:1Fail
2
1.1:1Fail
1.9:1Fail
1.2:1Fail
1.8:1Fail
3
2:1Fail
1.9:1Fail
2.4:1Fail
3.5:1AA18
4
1.2:1Fail
1.2:1Fail
2.4:1Fail
1.4:1Fail
5
1.7:1Fail
1.8:1Fail
3.5:1AA18
1.4:1Fail

Similar palettes

More like Ceramic Glaze Wash

View all cool