Palette

Oriental China Blues

A refined and delicate palette inspired by traditional blue and white porcelain artistry.

coolelegant5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Oriental China Blues 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 Oriental China Blues.

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

Data visualization

#36454F#576F7C#A7D9E0#D2EFF1#1F2C36

Palette guide

How to use Oriental China Blues

Overview

The Oriental China Blues palette is a refined and delicate collection inspired by traditional blue and white porcelain artistry. It features deep, sophisticated blues like `#36454F` (Charcoal Blue) and `#1F2C36` (Dark Slate Gray), perfectly complemented by the serene mid-tones of `#576F7C` (Slate Gray) and the airy `#A7D9E0` (Powder Blue). The very light `#D2EFF1` (Light Cyan) provides a crisp, clean base. This palette is ideal for designers looking to evoke a sense of timeless elegance, cultural heritage, and calm sophistication in their projects, from classic branding to serene digital interfaces.

Best used for

Traditional and classic brand identities
Home decor and textile design inspired by porcelain
Sophisticated web and UI design themes
Cultural institutions and art galleries
Luxury packaging with a heritage feel
Editorial design for art and history publications

Suggested color roles

primary

Use `#576F7C` (Slate Gray) for primary brand elements, key headings, or significant visual components, offering a balanced and elegant presence.

secondary

Employ `#A7D9E0` (Powder Blue) for supporting graphics, sub-sections, or lighter accents, providing a refreshing and delicate contrast.

accent

Apply `#36454F` (Charcoal Blue) or `#1F2C36` (Dark Slate Gray) for strong accents, calls to action, or deep backgrounds, adding a sense of depth and authority.

background

The bright and clean `#D2EFF1` (Light Cyan) is perfect for expansive backgrounds, creating a crisp and airy foundation reminiscent of white porcelain.

text

For text on lighter backgrounds, `#1F2C36` (Dark Slate Gray) or a deep charcoal provides excellent readability. On darker backgrounds, use white or a very light gray.

Accessibility notes

Text on `#D2EFF1` or `#A7D9E0` should be dark, such as `#1F2C36`, to ensure WCAG AA contrast.
White text on `#36454F` or `#1F2C36` offers strong legibility.
Avoid using light text on `#576F7C` without careful contrast verification.
Ensure sufficient contrast when using `#A7D9E0` for smaller design elements against lighter backgrounds.

Recommended combinations

Porcelain Classic

Recreates the iconic blue and white porcelain aesthetic, ideal for elegant and traditional designs.

#D2EFF1 · #576F7C · #1F2C36

Serene Layers

Offers a harmonious progression of cool blues, perfect for calming interfaces or sophisticated layouts.

#A7D9E0 · #576F7C · #36454F

Deep Elegance

Provides a striking contrast, using deep blue as a base with delicate lighter blues for highlights and readability.

#1F2C36 · #D2EFF1 · #A7D9E0

CSS variables

:root {
  --oriental-china-blues-1: #36454F;
  --oriental-china-blues-2: #576F7C;
  --oriental-china-blues-3: #A7D9E0;
  --oriental-china-blues-4: #D2EFF1;
  --oriental-china-blues-5: #1F2C36;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "oriental-china-blues": {
        1: "#36454F",
        2: "#576F7C",
        3: "#A7D9E0",
        4: "#D2EFF1",
        5: "#1F2C36",
      }
    }
  }
}

Hex values

Color 1#36454F

Color 2#576F7C

Color 3#A7D9E0

Color 4#D2EFF1

Color 5#1F2C36

Accessibility

Contrast checker

1.9:1Fail

6.4:1AA

8.2:1AAA

1.4:1Fail

1.9:1Fail

3.4:1AA18

4.4:1AA18

2.7:1Fail

6.4:1AA

3.4:1AA18

1.3:1Fail

9.3:1AAA

8.2:1AAA

4.4:1AA18

1.3:1Fail

11.8:1AAA

1.4:1Fail

2.7:1Fail

9.3:1AAA

11.8:1AAA

Similar palettes

More like Oriental China Blues

View all cool

Aurora Horizon Whisper

Nocturnal Ocean Gleam

Sapphire Shroud

Venetian Canal Mist

Winter Aurora Whisper

Art Deco Metropolis