Back to palettes

Palette

Cobalt Geode

Explores the sparkling depths of a cobalt geode, with intense blues and a hint of violet shimmer.

vibrantelegant5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cobalt Geode 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 Cobalt Geode.

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

Data visualization

#0A0A2A#1C1C4A#3B3B7A#6A6ABD#9B9BE1

Palette guide

How to use Cobalt Geode

Overview

The Cobalt Geode palette explores the sparkling depths of a cobalt geode, with intense blues and a hint of violet shimmer. Ranging from the profound #0A0A2A to the luminous #9B9BE1, this palette is perfect for designs demanding elegance, mystery, and a touch of vibrant luxury. Designers can leverage #1C1C4A as a strong primary, while #3B3B7A offers a versatile mid-tone for diverse applications. The brightest hue, #6A6ABD, provides a compelling highlight. This palette is ideal for projects that seek to convey sophistication, preciousness, and a captivating visual experience, from high-end branding to artistic digital creations.

Best used for

  • Luxury jewelry or crystal branding
  • High-end fashion and beauty products
  • Art gallery and museum exhibits
  • Mystical or fantasy-themed designs
  • Premium tech accessories visuals
  • Elegant event invitations

Suggested color roles

primary

#1C1C4A - A deep, rich indigo-violet that serves as a commanding primary, ideal for main headings, brand logos, or core UI elements, conveying luxury.

secondary

#3B3B7A - A vibrant, yet deep blue-violet that provides an energetic contrast, suitable for subheadings, active states, or supporting graphical elements.

accent

#9B9BE1 - A clear, luminous violet-blue that offers a striking highlight, perfect for interactive elements, key data points, or subtle background textures.

background

#0A0A2A - An almost-black, ultra-deep blue, creating an immersive, dark backdrop that makes lighter elements appear to glow with internal light.

text

For text on #0A0A2A, #1C1C4A, or #3B3B7A, use #9B9BE1 or white for optimal readability. For text on #9B9BE1, use black or #0A0A2A.

Accessibility notes

  • Ensure high contrast when placing light text, such as #9B9BE1, on darker blues like #0A0A2A or #1C1C4A.
  • Avoid using #6A6ABD for small text on #3B3B7A without verifying WCAG AA compliance due to similar luminance.
  • The brightest hue, #9B9BE1, offers excellent contrast against all darker blues in the palette for interactive elements.
  • When using #9B9BE1 as a background, ensure text is in a contrasting dark color like black or #0A0A2A to maintain legibility.

Recommended combinations

Crystal Shard

Creates a dramatic, sparkling interface; #0A0A2A for background, #3B3B7A for content, #9B9BE1 for luminous accents/CTAs.

#0A0A2A · #3B3B7A · #9B9BE1

Geode Core

Use #1C1C4A for main sections, #6A6ABD for supporting elements, and #9B9BE1 for vibrant accents or delicate details.

#1C1C4A · #6A6ABD · #9B9BE1

Deep Amethyst

Ideal for creating depth through gradients or layered UI, moving from the deepest indigo to a rich blue-violet.

#0A0A2A · #1C1C4A · #3B3B7A

CSS variables

:root {
  --cobalt-geode-1: #0A0A2A;
  --cobalt-geode-2: #1C1C4A;
  --cobalt-geode-3: #3B3B7A;
  --cobalt-geode-4: #6A6ABD;
  --cobalt-geode-5: #9B9BE1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cobalt-geode": {
        1: "#0A0A2A",
        2: "#1C1C4A",
        3: "#3B3B7A",
        4: "#6A6ABD",
        5: "#9B9BE1",
      }
    }
  }
}

Related searches

cobalt violet color paletteluxury blue purple schemeelegant geode colorsdeep shimmering bluevibrant mysterious UI

Palette colors

Hex values

Color 1#0A0A2A
·
Color 2#1C1C4A
·
Color 3#3B3B7A
·
Color 4#6A6ABD
·
Color 5#9B9BE1
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.9:1Fail
4:1AA18
7.5:1AAA
2
1.2:1Fail
1.6:1Fail
3.4:1AA18
6.2:1AA
3
1.9:1Fail
1.6:1Fail
2.1:1Fail
3.9:1AA18
4
4:1AA18
3.4:1AA18
2.1:1Fail
1.9:1Fail
5
7.5:1AAA
6.2:1AA
3.9:1AA18
1.9:1Fail

Similar palettes

More like Cobalt Geode

View all vibrant
Crystal Cavern Sparkle
Crystal Geode Sparkle
Amethyst Aura
Enchanted Forest Berry
Garnet Stage Curtain
Geode Mineral Luster