An intense, high-voltage streaming palette built around neon energy, visual noise, and punchy contrast. The colors feel chaotic and expressive without losing a clear system for live content, overlays, and creator branding.
An intense, high-voltage streaming palette built around neon energy, visual noise, and punchy contrast. The colors feel chaotic and expressive without losing a clear system for live content, overlays, and creator branding.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors form a loud triadic system that reads instantly in motion, thumbnails, overlays, and live scenes. Each hue has a distinct job, so the palette feels energetic and chaotic without becoming visually random.
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 loud triadic system that reads instantly in motion, thumbnails, overlays, and live scenes. Each hue has a distinct job, so the palette feels energetic and chaotic without becoming visually random.
RolesLogo, Btn Primary Bg
A fierce, attention-grabbing pink that gives the brand its shout-first personality and thumbnail impact.
#FF2D55255, 45, 85349, 100, 590, 82, 67, 0RolesLink, Btn Secondary Bg
A vivid violet that adds depth and stream-friendly contrast while keeping the system playful and digitally charged.
#7C3AED124, 58, 237262, 83, 5848, 76, 0, 7RolesBtn Outlined Border, Btn Outlined Text, Headline
A blazing amber accent that amplifies urgency, highlights key moments, and keeps the identity feeling unpredictable.
#FFB800255, 184, 043, 100, 500, 28, 100, 0The support colors extend the main palette with controlled intensity, adding motion-ready depth and a sharper technical edge. They stay subordinate, reinforcing the neon system and
RolesIcon, Outline
A clean neon cyan that cools the palette just enough to sharpen UI accents and make interactive elements pop.
#00D1FF0, 209, 255191, 100, 50100, 18, 0, 0RolesBorder, Divider
A hot orange support tone that bridges pink and amber, useful for separators, frames, and high-alert details.
#FF5F1F255, 95, 3117, 100, 560, 63, 88, 0Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F2F2E8242, 242, 23260, 28, 930, 0, 4, 5RolesBg Dark, Text, Btn Primary 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-hyper-punch-pink: #FF2D55;
--color-electric-grape: #7C3AED;
--color-shock-burst-amber: #FFB800;
--color-laser-cyan: #00D1FF;
--color-voltage-orange: #FF5F1F;
--color-pure-signal-white: #FFFFFF;
--color-static-paper: #F2F2E8;
--color-void-black: #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: #FF2D55;
--role-btn-primary-bg: #FF2D55;
--role-link: #7C3AED;
--role-btn-secondary-bg: #7C3AED;
--role-btn-outlined-border: #FFB800;
--role-btn-outlined-text: #FFB800;
--role-headline: #FFB800;
--role-icon: #00D1FF;
--role-outline: #00D1FF;
--role-border: #FF5F1F;
--role-divider: #FF5F1F;
--role-bg-light: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-bg-dark: #0B0B10;
--role-text: #0B0B10;
--role-btn-primary-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.{
"hyper-punch-pink": "#FF2D55",
"electric-grape": "#7C3AED",
"shock-burst-amber": "#FFB800",
"laser-cyan": "#00D1FF",
"voltage-orange": "#FF5F1F",
"pure-signal-white": "#FFFFFF",
"static-paper": "#F2F2E8",
"void-black": "#0B0B10"
}