Palette
A dynamic flow of electric blues and cyans, simulating the vibrant pulse of a current.
Preview
Interface
A quick look at how Electric Current Pulse reads on buttons, badges, and alerts before you commit.
Marketing banner
A bolder treatment that stretches the primary and secondary colors across a full gradient banner.
Data visualization
Palette guide
The 'Electric Current Pulse' palette presents a dynamic flow of electric blues and cyans, simulating the vibrant pulse of a current. This cohesive scheme progresses from bright #00ffff cyan through various electric blues like #00aaff, #0055ff, and #0000ff, culminating in a deep #0000cc. It offers depth and a sense of movement, ideal for tech-focused, digital, or futuristic designs that require a clean, energetic, and sophisticated blue aesthetic.
primary
Utilize #00aaff as the dominant electric blue for main calls-to-action, prominent headings, or key interactive elements.
secondary
Employ #0055ff for supporting elements, subheadings, or to create a subtle depth within the blue spectrum, complementing the primary hue.
accent
Apply #00ffff sparingly for high-energy highlights, glowing effects, notifications, or small details that need to pop dramatically.
background
Use a darker blue like #0000cc or #0000ff as the primary background to establish a deep, atmospheric canvas, or white for a clean techy look.
text
For body text on dark backgrounds, use white or a very light grey. For impactful headings or alerts, #00ffff will provide excellent contrast and visibility.
Ideal for dark mode UI: #0000cc as background, #00aaff for primary content, and #00ffff for urgent notifications or interactive elements.
#0000CC · #00AAFF · #00FFFFCreate a smooth, dynamic blue gradient for backgrounds or large graphical elements, adding depth and visual interest.
#0055FF · #00AAFF · #00FFFFUse #0000ff as a base, #00aaff for subtle elements, and #00ffff for striking, eye-catching accents in digital art or tech interfaces.
#0000FF · #00AAFF · #00FFFF:root {
--electric-current-pulse-1: #00ffff;
--electric-current-pulse-2: #00aaff;
--electric-current-pulse-3: #0055ff;
--electric-current-pulse-4: #0000ff;
--electric-current-pulse-5: #0000cc;
}theme: {
extend: {
colors: {
"electric-current-pulse": {
1: "#00ffff",
2: "#00aaff",
3: "#0055ff",
4: "#0000ff",
5: "#0000cc",
}
}
}
}Palette colors
Accessibility
Similar palettes