Palette

Deep Space

A stark, modern palette inspired by the profound darkness and distant, cool glows of outer space.

darkminimal5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Space 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 Deep Space.

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

Data visualization

#0B0C10#1F2833#45A29E#66FCF1#C5C6C7

Palette guide

How to use Deep Space

Overview

The Deep Space palette offers a stark, modern aesthetic inspired by the profound darkness and distant, cool glows of outer space. It masterfully combines deep, almost-black tones like #0B0C10 and #1F2833 with striking, luminous accents such as #45A29E and #66FCF1, alongside a clean, light grey #C5C6C7. This versatile palette is excellent for designers and developers seeking to create contemporary, high-tech, or minimalist experiences. Its balanced contrast and cool color scheme make it perfect for interfaces, branding, or digital art that requires a sense of precision, innovation, and futuristic elegance.

Best used for

Modern tech company branding
Sleek dashboard UI designs
Science fiction game interfaces
Architectural visualization platforms
Minimalist portfolio websites
Dark mode themes with bright, cool accents

Suggested color roles

primary

#1F2833 - A deep, dark blue-grey, excellent for main content areas, navigation, or primary branding elements, providing a stable and modern foundation.

secondary

#0B0C10 - The darkest, almost black, ideal for secondary backgrounds, subtle dividers, or shadow effects, adding profound depth.

accent

#66FCF1 - A vibrant, electric aqua, perfect for interactive elements, calls-to-action, or important notifications, demanding immediate attention with its intense glow.

background

#0B0C10 - The darkest blue-grey, serving as an expansive, modern backdrop for the entire design, setting a sleek and professional mood.

text

#C5C6C7 - For primary text on dark backgrounds, ensuring excellent readability and a consistent cool, modern aesthetic.

Accessibility notes

Ensure #C5C6C7 text on #0B0C10 or #1F2833 backgrounds meets WCAG AA contrast standards for readability.
The vibrant accents #45A29E and #66FCF1 should be used with sufficient contrast for interactive elements against dark backgrounds.
Avoid using #45A29E for small body text against #1F2833 as contrast might be insufficient.
Provide clear visual cues for focus and hover states for interactive elements, perhaps using a distinct glow or border with #66FCF1.

Recommended combinations

Cosmic Core

Creates a strong, minimalist base for content, with #0B0C10 as background, #C5C6C7 for text, and #1F2833 for secondary panels.

#0B0C10 · #1F2833 · #C5C6C7

Tech Glow

Excellent for data visualization or progress indicators, moving from deep blue-grey to vibrant, glowing accents.

#1F2833 · #45A29E · #66FCF1

Modern Contrast

Ideal for striking content hierarchy, with #0B0C10 as background, #66FCF1 for bold headings, and #45A29E for supporting details.

#0B0C10 · #66FCF1 · #45A29E

CSS variables

:root {
  --deep-space-1: #0B0C10;
  --deep-space-2: #1F2833;
  --deep-space-3: #45A29E;
  --deep-space-4: #66FCF1;
  --deep-space-5: #C5C6C7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-space": {
        1: "#0B0C10",
        2: "#1F2833",
        3: "#45A29E",
        4: "#66FCF1",
        5: "#C5C6C7",
      }
    }
  }
}

Hex values

Color 1#0B0C10

Color 2#1F2833

Color 3#45A29E

Color 4#66FCF1

Color 5#C5C6C7

Accessibility

Contrast checker

1.3:1Fail

6.4:1AA

15.6:1AAA

11.4:1AAA

1.3:1Fail

4.9:1AA

11.9:1AAA

8.7:1AAA

6.4:1AA

4.9:1AA

2.4:1Fail

1.8:1Fail

15.6:1AAA

11.9:1AAA

2.4:1Fail

1.4:1Fail

11.4:1AAA

8.7:1AAA

1.8:1Fail

1.4:1Fail

Similar palettes

More like Deep Space

Brutalist Concrete Form

Cyber City Dream

Celestial Abyss Gaze