Palette
A high-contrast palette embodying the sleek, electrifying energy of a futuristic digital landscape.
Preview
Interface
A quick look at how Electric Cyber Wave 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 Cyber Wave' palette embodies the sleek, electrifying energy of a futuristic digital landscape with high-contrast elements. Featuring vibrant #FF00FF magenta, electric #00FFFF cyan, and rich #8A2BE2 purple, all set against stark #000000 black and crisp #F8F8F8 white, it offers a dynamic and modern aesthetic. This scheme is ideal for designs that need to convey cutting-edge technology, a cyberpunk vibe, or a clean yet energetic digital presence.
primary
Utilize #00FFFF as the dominant electric cyan for main calls-to-action, prominent headings, or key interactive elements that convey tech.
secondary
Employ #FF00FF for strong supporting elements, subheadings, or to create a vibrant contrast with the primary cyan, adding dynamic energy.
accent
Apply #8A2BE2 sparingly for vibrant purple highlights, glowing effects, notifications, or small details that need a distinct pop.
background
Use #000000 as the primary dark background for dramatic contrast, or #F8F8F8 for a clean, bright, and modern alternative.
text
For body text on dark backgrounds, #F8F8F8 provides excellent readability. For prominent headlines, #00FFFF or #FF00FF will be highly effective.
Ideal for a dark mode UI: #000000 as background, #00FFFF for primary content, and #F8F8F8 for legible text and highlights.
#000000 · #00FFFF · #F8F8F8Combine these three for dynamic, eye-catching highlights or a vibrant color block design, perfect for digital art or event graphics.
#FF00FF · #00FFFF · #8A2BE2Use #F8F8F8 as a clean base, with #8A2BE2 for vibrant accents and #000000 for strong outlines or text in a light mode design.
#F8F8F8 · #8A2BE2 · #000000:root {
--electric-cyber-wave-1: #FF00FF;
--electric-cyber-wave-2: #00FFFF;
--electric-cyber-wave-3: #000000;
--electric-cyber-wave-4: #8A2BE2;
--electric-cyber-wave-5: #F8F8F8;
}theme: {
extend: {
colors: {
"electric-cyber-wave": {
1: "#FF00FF",
2: "#00FFFF",
3: "#000000",
4: "#8A2BE2",
5: "#F8F8F8",
}
}
}
}Palette colors
Accessibility
Similar palettes