This palette pairs electrified neon magenta, acid lime, and deep ultraviolet to capture Skrillex-inspired energy with a bold, club-ready edge. The accents keep the system kinetic and high-contrast, while the neutrals ground the experience so the palette works in branding and digital interfaces.
This palette pairs electrified neon magenta, acid lime, and deep ultraviolet to capture Skrillex-inspired energy with a bold, club-ready edge. The accents keep the system kinetic and high-contrast, while the neutrals ground the experience so the palette works in branding and digital interfaces.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors form a high-voltage triadic system that feels aggressive, futuristic, and instantly recognizable. Their separation creates the same kind of visual punch and motion associated with bass-heavy electronic branding.
Clear roles create a consistent brand experience.Assign existing palette colors to brand, typography, and interface roles.
A compact view of the brand, support, and neutral colors that make up this system.
The main colors form a high-voltage triadic system that feels aggressive, futuristic, and instantly recognizable. Their separation creates the same kind of visual punch and motion associated with bass-heavy electronic branding.
RolesLogo, Btn Primary Bg
Neon Magenta delivers the signature flash and performance energy that makes the brand feel loud and current.
#FF2BD6255, 43, 214312, 100, 580, 83, 16, 0RolesLink, Btn Secondary Bg
Acid Lime adds a sharp, digital spark that amplifies attention and keeps the system feeling high-intensity.
#B6FF00182, 255, 077, 100, 5029, 0, 100, 0RolesHeadline, Btn Outlined Border, Btn Outlined Text
Electric Violet brings depth and a darker rave-like tone that stabilizes the palette without dulling its energy.
#6A00FF106, 0, 255265, 100, 5058, 100, 0, 0The support colors extend the neon palette with cooler, more restrained notes that improve structure and usability. They balance the primary hues by adding contrast, separation, and a touch of industrial polish.
RolesIcon, Outline
Cyan adds a crisp digital accent that supports navigation and interface clarity without competing with the main neon colors.
#00D7FF0, 215, 255189, 100, 50100, 16, 0, 0RolesBorder, Divider
Coral introduces a warm pulse that offsets the cooler lights and helps separators stay visible in dense layouts.
#FF7A18255, 122, 2425, 100, 550, 52, 91, 0Utility colors for backgrounds, text, borders, and balance.
RolesBg Light
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F3F4F8243, 244, 248228, 26, 962, 2, 0, 3RolesBg Dark, Text, Btn Primary Text, Btn Secondary Text
#0B0B1011, 11, 16240, 19, 531, 31, 0, 94Copy palette values for design systems, websites, and client handoff.
Use these in CSS when you want every raw palette color available by name. Best for websites, landing pages, and design system variables.
Use when: you need the actual colors.:root {
--color-neon-magenta: #FF2BD6;
--color-acid-lime: #B6FF00;
--color-electric-violet: #6A00FF;
--color-cyan: #00D7FF;
--color-coral: #FF7A18;
--color-white: #FFFFFF;
--color-ghost-white: #F3F4F8;
--color-charcoal: #0B0B10;
}Use these in CSS when colors are assigned to practical jobs like text, buttons, borders, links, and backgrounds.
Use when: you need UI roles, not just swatches.:root {
--role-logo: #FF2BD6;
--role-btn-primary-bg: #FF2BD6;
--role-link: #B6FF00;
--role-btn-secondary-bg: #B6FF00;
--role-headline: #6A00FF;
--role-btn-outlined-border: #6A00FF;
--role-btn-outlined-text: #6A00FF;
--role-icon: #00D7FF;
--role-outline: #00D7FF;
--role-border: #FF7A18;
--role-divider: #FF7A18;
--role-bg-light: #FFFFFF;
--role-bg-dark: #0B0B10;
--role-text: #0B0B10;
--role-btn-primary-text: #0B0B10;
--role-btn-secondary-text: #0B0B10;
}Use this structured palette data in apps, generators, plugins, or tools that need to read the palette programmatically.
Use when: a developer or app needs data.{
"neon-magenta": "#FF2BD6",
"acid-lime": "#B6FF00",
"electric-violet": "#6A00FF",
"cyan": "#00D7FF",
"coral": "#FF7A18",
"white": "#FFFFFF",
"ghost-white": "#F3F4F8",
"charcoal": "#0B0B10"
}