Skip to content
Musterli

Dark

Planetarium color palette

Night sky, violet nebula, a blue star and starlight.

Open in the palette generator

Lock colors, roll new variations with the space bar and export as image or code.

Colors

Click a value to copy it. Each swatch shows its value in the text color that reads best on it.

  1. Color 1

    Text in white, contrast 19.4:1

  2. Color 2

    Text in white, contrast 13.9:1

  3. Color 3

    Text in white, contrast 7.9:1

  4. Color 4

    Text in black, contrast 8.0:1

  5. Color 5

    Text in black, contrast 17.0:1

Code

The palette as CSS variables for any project and as a theme for Tailwind CSS v4.

CSS variables

:root {
  --palette-1: #0b0c16;
  --palette-2: #2e2553;
  --palette-3: #623e96;
  --palette-4: #49abd6;
  --palette-5: #f2e7ca;
}

Tailwind theme

@theme {
  --color-planetarium-1: oklch(15.9% 0.021 279.3);
  --color-planetarium-2: oklch(30% 0.081 289.7);
  --color-planetarium-3: oklch(45% 0.14 299.7);
  --color-planetarium-4: oklch(70.1% 0.11 230.1);
  --color-planetarium-5: oklch(92.9% 0.04 89.7);
}

Gradients from this palette

The same colors as a gradient. Each card opens the editor with these colors.

Keep working with the palette

Edit the palette or build a full scale from its most colorful entry.

How to use this palette

Use the lightest color as the background and the darkest for text. The strong colors in between work for buttons, links and highlights. Always check the contrast for text; the notes on the swatches show whether black or white reads better.

All color palettes
  • Night Train

    Deep blues and the warm light of a compartment window.

  • Fireside

    Soot, embers, flame and warm light.

  • Velvet Curtain

    Dark wine, velvet red and golden accents, like a theater.

  • Forest Night

    Five greens from dark undergrowth to moonlight on the leaves.

  • Concrete

    Five neutral grays without a tint, a base for any interface.