Back to palettes

Palette

Sci-Fi Hologram Bloom

An ethereal, glowing palette inspired by vibrant, digital holograms and alien flora.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sci-Fi Hologram 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 Sci-Fi Hologram Bloom.

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

Data visualization

#00A693#00FFCD#6EEB83#B8F2E6#D8F7F0

Palette guide

How to use Sci-Fi Hologram Bloom

Overview

The Sci-Fi Hologram Bloom palette offers a captivating journey into digital futurism, blending ethereal glows with vibrant energy. Dominated by electric greens and teals, this palette features the deep, grounding teal of #00A693, the luminous cyan of #00FFCD, and the vivid lime-green of #6EEB83. These striking hues are beautifully balanced by the softer, almost translucent tones of #B8F2E6 and #D8F7F0, which mimic the subtle glow of light sources. Ideal for designers and developers crafting immersive interfaces or dynamic branding, this collection evokes a sense of advanced technology, otherworldly flora, and high-tech elegance. It's perfect for projects requiring a fresh, energetic, and distinctly modern aesthetic that stands out.

Best used for

  • Futuristic UI/UX designs and interactive interfaces
  • Gaming aesthetics, particularly for sci-fi or fantasy genres
  • Digital art, illustrations, and abstract animations
  • Tech startup branding and corporate identity
  • Event promotion for tech conferences or music festivals
  • Motion graphics and animated title sequences

Suggested color roles

primary

Utilize #00A693 as the foundational color for main structural elements, headers, or key brand components. Its depth provides a stable, yet vibrant base for the more luminous hues.

secondary

Employ #00FFCD for secondary navigation, active states, or supporting graphics. It offers a bright, energetic counterpoint without overpowering the primary, enhancing digital themes.

accent

Reserve #6EEB83 for high-impact elements like call-to-action buttons, interactive highlights, or important notifications where maximum visibility is desired. Its neon quality ensures immediate attention.

background

Use #D8F7F0 for clean, luminous backgrounds, providing ample breathing room for the vibrant colors. It creates an ethereal, soft glow effect without being stark white.

text

For optimal readability, use a dark charcoal like #333333 or pure black on the lighter backgrounds (#D8F7F0, #B8F2E6). For text against #00A693, white or a very light gray is essential.

Accessibility notes

  • Always check contrast ratios for text, especially when using #6EEB83 on light backgrounds like #D8F7F0 or #B8F2E6, to meet WCAG AA standards.
  • For critical information, avoid relying solely on color differences between similar hues like #00A693 and #00FFCD; use additional visual cues.
  • Ensure sufficient contrast for all interactive elements. Buttons and links should have a clear visual distinction from their surroundings.
  • Consider providing alternative text or icons for users with color vision deficiencies, as the green-heavy nature might present challenges for some.

Recommended combinations

High Contrast UI

Ideal for high-contrast user interfaces where clarity and a strong futuristic vibe are paramount. #00A693 provides depth, #6EEB83 highlights interactive elements, and #D8F7F0 ensures readability.

#00A693 · #6EEB83 · #D8F7F0

Ethereal Gradient

Perfect for creating soft, glowing backgrounds or header gradients. This blend offers a seamless transition, evoking a digital mist or a gentle holographic effect suitable for hero sections.

#00FFCD · #B8F2E6 · #D8F7F0

Dynamic Focus

A powerful trio for dynamic elements, data visualization, or distinct brand segments. Each color stands out, allowing for clear differentiation in complex information displays or multi-state components.

#00A693 · #00FFCD · #6EEB83

CSS variables

:root {
  --sci-fi-hologram-bloom-1: #00A693;
  --sci-fi-hologram-bloom-2: #00FFCD;
  --sci-fi-hologram-bloom-3: #6EEB83;
  --sci-fi-hologram-bloom-4: #B8F2E6;
  --sci-fi-hologram-bloom-5: #D8F7F0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sci-fi-hologram-bloom": {
        1: "#00A693",
        2: "#00FFCD",
        3: "#6EEB83",
        4: "#B8F2E6",
        5: "#D8F7F0",
      }
    }
  }
}

Related searches

futuristic color schemesneon green teal palettedigital UI colorsvibrant sci-fi palettehologram aesthetic colors

Palette colors

Hex values

Color 1#00A693
·
Color 2#00FFCD
·
Color 3#6EEB83
·
Color 4#B8F2E6
·
Color 5#D8F7F0
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.4:1Fail
2:1Fail
2.5:1Fail
2.7:1Fail
2
2.4:1Fail
1.2:1Fail
1:1Fail
1.1:1Fail
3
2:1Fail
1.2:1Fail
1.2:1Fail
1.3:1Fail
4
2.5:1Fail
1:1Fail
1.2:1Fail
1.1:1Fail
5
2.7:1Fail
1.1:1Fail
1.3:1Fail
1.1:1Fail

Similar palettes

More like Sci-Fi Hologram Bloom

View all vibrant
Digital Circuit Haze
Cosmic Ray Burst
Cyber Glow
Digital Synth Rhythm
Digital Synthwave Horizon
Downtown Neon Canvas