Palette

Mediterranean Tile Art

Bright blues and greens, reminiscent of vibrant ceramic tiles under the Mediterranean sun.

coolnatural5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mediterranean Tile Art 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 Mediterranean Tile Art.

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

Data visualization

#B0C4DE#87CEEB#4169E1#008B8B#6B8E23

Palette guide

How to use Mediterranean Tile Art

Overview

The "Mediterranean Tile Art" palette is a vibrant celebration of cool, aquatic, and earthy tones inspired by classic ceramic tiles. It features a refreshing spectrum from the soft #B0C4DE (Light Steel Blue) to the bright #87CEEB (Sky Blue) and deep #4169E1 (Royal Blue), anchored by the striking #008B8B (Dark Cyan) and a surprising touch of #6B8E23 (Olive Drab). This palette is excellent for designers seeking to evoke a sense of craftsmanship, serenity, and a lively natural environment. It's ideal for projects that require a fresh yet grounded aesthetic, perfect for digital interfaces, illustrative work, or decor-focused branding.

Best used for

Website design for travel agencies
Branding for artisan tile shops
Mobile app interfaces with a fresh feel
Illustrations and digital art
Eco-friendly product packaging
Interior design concepts (bathrooms, kitchens)

Suggested color roles

primary

Use #4169E1 (Royal Blue) as a strong, captivating primary for headers, navigation, or key brand elements, conveying trust and vibrancy.

secondary

Employ #87CEEB (Sky Blue) for subheadings, active states, or graphic elements, providing a refreshing contrast and expanding the cool appeal.

accent

Apply #008B8B (Dark Cyan) or #6B8E23 (Olive Drab) sparingly for call-to-action buttons or key highlights to add a unique, grounding pop of color.

background

Utilize #B0C4DE (Light Steel Blue) as a soft, airy backdrop for main content areas, ensuring excellent readability and a sense of calm.

text

For primary body text, use #4169E1 (Royal Blue) or a dark charcoal on light backgrounds like #B0C4DE. For headings on darker backgrounds, #B0C4DE works well.

Accessibility notes

Ensure #4169E1 or a dark charcoal has sufficient contrast against #B0C4DE for body text readability (WCAG AA standard).
#87CEEB may have insufficient contrast for small text on #B0C4DE; reserve it for larger display text or graphical elements.
Test #008B8B and #6B8E23 carefully when used as text on lighter blues; ensure adequate contrast for legibility.
Avoid using #87CEEB directly as text on #B0C4DE for critical information to prevent low contrast issues.

Recommended combinations

Aqua Harmony

Ideal for creating a serene, aquatic feel in web headers, background gradients, or UI elements that require a calming, expansive look.

#4169E1 · #87CEEB · #B0C4DE

Vibrant Accents

Perfect for highlighting calls to action, decorative patterns, or graphical elements that need a unique, earthy contrast against blue.

#008B8B · #6B8E23 · #4169E1

Tile Patterns

Suitable for subtle patterns, borders, or interactive elements that evoke a mosaic or intricate tilework design with a fresh appeal.

#B0C4DE · #008B8B · #87CEEB

CSS variables

:root {
  --mediterranean-tile-art-1: #B0C4DE;
  --mediterranean-tile-art-2: #87CEEB;
  --mediterranean-tile-art-3: #4169E1;
  --mediterranean-tile-art-4: #008B8B;
  --mediterranean-tile-art-5: #6B8E23;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mediterranean-tile-art": {
        1: "#B0C4DE",
        2: "#87CEEB",
        3: "#4169E1",
        4: "#008B8B",
        5: "#6B8E23",
      }
    }
  }
}

Hex values

Color 1#B0C4DE

Color 2#87CEEB

Color 3#4169E1

Color 4#008B8B

Color 5#6B8E23

Accessibility

Contrast checker

1:1Fail

2.7:1Fail

2.3:1Fail

2.1:1Fail

1:1Fail

2.8:1Fail

2.4:1Fail

2.2:1Fail

2.7:1Fail

2.8:1Fail

1.2:1Fail

1.3:1Fail

2.3:1Fail

2.4:1Fail

1.2:1Fail

1.1:1Fail

2.1:1Fail

2.2:1Fail

1.3:1Fail

1.1:1Fail

Similar palettes

More like Mediterranean Tile Art

View all cool

Deep Sea Coral

Mystical Aurora Borealis