Back to palettes

Palette

Celestial Night Bloom

A deep cosmic expanse where distant nebulae softly glow against the dark, inspiring wonder.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Night Bloom 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 Celestial Night Bloom.

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

Data visualization

#1A2B42#475D79#7D90A5#F7DC6F#B22222

Palette guide

How to use Celestial Night Bloom

Overview

The Celestial Night Bloom palette offers a sophisticated blend of deep, cool blues and grays, reminiscent of a mysterious night sky, accented by a glowing gold and a bold red. Ranging from the profound #1A2B42 to the lighter #7D90A5, this palette gains a dramatic twist with the radiant #F7DC6F and striking #B22222. It's perfect for designs that require a sense of depth, elegance, and subtle urgency or importance. Designers can use this combination to create visually rich interfaces, while developers will appreciate the clear hex codes for implementing a dark, professional theme with impactful highlight colors.

Best used for

  • Luxury automotive or watch brands
  • Financial services or corporate websites
  • High-end event or gala branding
  • Dark mode themes for professional tools
  • Photography portfolios showcasing dramatic imagery
  • Mystery novel covers or film promotions

Suggested color roles

primary

#1A2B42 provides a deep, commanding base for backgrounds or main structural elements.

secondary

#475D79 acts as a sophisticated mid-tone blue-gray, ideal for secondary panels or text backgrounds.

accent

#F7DC6F offers a luminous, warm glow for calls-to-action, important notifications, or key highlights. #B22222 can be used for warnings or strong emphasis.

background

#1A2B42 or a slightly lighter #475D79 provide a dark, elegant canvas.

text

Use white or a very light gray like #7D90A5 for main body text on dark backgrounds.

Accessibility notes

  • Ensure #F7DC6F and white text have excellent contrast on #1A2B42 and #475D79.
  • The red #B22222 should be used sparingly and always with high contrast text (e.g., white) if used for messages.
  • Avoid using #7D90A5 for small text on #475D79 as contrast may be insufficient.
  • Verify contrast ratios for all color combinations, especially for interactive elements, to meet WCAG standards.

Recommended combinations

Night Glow

Ideal for hero sections, presenting key information with a warm, inviting glow against deep blues.

#1A2B42 · #475D79 · #F7DC6F

Elegant Contrast

Effective for data visualization or status indicators, using subtle blue-grays with a strong warning accent.

#475D79 · #7D90A5 · #B22222

Deep Serenity

Creates a sophisticated and calm aesthetic, suitable for intros or atmospheric backgrounds.

#1A2B42 · #7D90A5 · #F7DC6F

CSS variables

:root {
  --celestial-night-bloom-1: #1A2B42;
  --celestial-night-bloom-2: #475D79;
  --celestial-night-bloom-3: #7D90A5;
  --celestial-night-bloom-4: #F7DC6F;
  --celestial-night-bloom-5: #B22222;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-night-bloom": {
        1: "#1A2B42",
        2: "#475D79",
        3: "#7D90A5",
        4: "#F7DC6F",
        5: "#B22222",
      }
    }
  }
}

Related searches

deep blue gold palettemysterious night sky colorselegant dark mode themeprofessional blue gray schemecelestial branding with red

Palette colors

Hex values

Color 1#1A2B42
·
Color 2#475D79
·
Color 3#7D90A5
·
Color 4#F7DC6F
·
Color 5#B22222
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.1:1Fail
4.4:1AA18
10.5:1AAA
2.1:1Fail
2
2.1:1Fail
2.1:1Fail
5:1AA
1:1Fail
3
4.4:1AA18
2.1:1Fail
2.4:1Fail
2:1Fail
4
10.5:1AAA
5:1AA
2.4:1Fail
4.9:1AA
5
2.1:1Fail
1:1Fail
2:1Fail
4.9:1AA

Similar palettes

More like Celestial Night Bloom

View all dark
Celestial Sapphire Dust
Cosmic Veil Wonder
Starlit Canvas
Celestial Deep Blue
Celestial Night Sky
Celestial Void Gaze