Back to palettes

Palette

Electric Circuit Surge

Shocking blues and vibrant cyans inspired by the energetic flow and connections within an electric circuit board.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Electric Circuit Surge 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 Electric Circuit Surge.

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

Data visualization

#00FFFF#00CED1#00BFFF#ADD8E6#E0FFFF

Palette guide

How to use Electric Circuit Surge

Overview

The "Electric Circuit Surge" palette features shocking blues and vibrant cyans, inspired by the energetic flow and connections within an electric circuit board. It ranges from an intense Cyan (#00FFFF) and Dark Cyan (#00CED1) to a brilliant Deep Sky Blue (#00BFFF). Lighter shades like Light Blue (#ADD8E6) and a very pale Light Cyan (#E0FFFF) soften the intensity while maintaining the electric feel. This cohesive, cool-toned palette is perfect for designers creating modern, tech-focused, or sleek digital interfaces. Developers can leverage these harmonious hues to build engaging UIs, progress indicators, or data visualizations that feel fresh, dynamic, and integrated.

Best used for

  • Modern tech company branding or websites
  • Software UI/UX design, especially for data displays
  • Water-themed or clean energy initiatives
  • Digital art with a cool, electric theme
  • Medical technology or scientific research interfaces
  • Communication platforms requiring a clean, efficient aesthetic

Suggested color roles

primary

#00FFFF (Cyan) - Use for main interactive elements, prominent headings, or to signify active states with high energy and a cool glow.

secondary

#00BFFF (Deep Sky Blue) - Ideal for subheadings, secondary buttons, or background sections that need a slightly deeper, yet still vibrant blue.

accent

#00CED1 (Dark Cyan) - Perfect for small, impactful highlights, icons, or to introduce a unique, slightly darker electric pulse.

background

#E0FFFF (Light Cyan) - A very light, airy background that allows the brighter and deeper blues to pop, creating a clean, luminous effect.

text

#00BFFF (Deep Sky Blue) - Offers excellent readability on very light backgrounds like #E0FFFF or #ADD8E6. For darker backgrounds, white or near-white is recommended.

Accessibility notes

  • Ensure adequate contrast for text, especially between adjacent light blues.
  • Avoid using #ADD8E6 or #E0FFFF for small body text on similarly light backgrounds.
  • For interactive elements, use #00FFFF or #00BFFF to ensure clear visual cues.
  • Consider using a dark charcoal or black text for maximum readability on the palest backgrounds if palette colors don't meet requirements.

Recommended combinations

Digital Current

A very light background with deep sky blue text and cyan highlights, for sleek tech interfaces.

#E0FFFF · #00BFFF · #00FFFF

Circuit Gradient

A smooth transition from vibrant cyan to deep sky blue, ideal for animated backgrounds or progress bars.

#00FFFF · #00CED1 · #00BFFF

Energy Flow

Dark cyan with light blue and light cyan, suitable for layered UI elements or depicting subtle energy flows.

#00CED1 · #ADD8E6 · #E0FFFF

CSS variables

:root {
  --electric-circuit-surge-1: #00FFFF;
  --electric-circuit-surge-2: #00CED1;
  --electric-circuit-surge-3: #00BFFF;
  --electric-circuit-surge-4: #ADD8E6;
  --electric-circuit-surge-5: #E0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "electric-circuit-surge": {
        1: "#00FFFF",
        2: "#00CED1",
        3: "#00BFFF",
        4: "#ADD8E6",
        5: "#E0FFFF",
      }
    }
  }
}

Related searches

electric circuit bluecyan tech paletteglowing blue gradientdigital surge colorsfuturistic UI blue

Palette colors

Hex values

Color 1#00FFFF
·
Color 2#00CED1
·
Color 3#00BFFF
·
Color 4#ADD8E6
·
Color 5#E0FFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.7:1Fail
1.2:1Fail
1.2:1Fail
2
1.6:1Fail
1.1:1Fail
1.3:1Fail
1.9:1Fail
3
1.7:1Fail
1.1:1Fail
1.4:1Fail
2:1Fail
4
1.2:1Fail
1.3:1Fail
1.4:1Fail
1.4:1Fail
5
1.2:1Fail
1.9:1Fail
2:1Fail
1.4:1Fail

Similar palettes

More like Electric Circuit Surge

View all vibrant
Cybernetic City Grid
Digital Dawn
Digital Rift Neon
Electric Circuit Buzz
Electric Current Pulse
Electric Grid