This KPop-inspired palette pairs vivid idol-stage energy with polished editorial contrast, so it feels both high-impact and brand-ready. The main colors create a recognizable pop system that can flex across campaigns, fan communities, and digital experiences without losing its performance-driven edge.
This KPop-inspired palette pairs vivid idol-stage energy with polished editorial contrast, so it feels both high-impact and brand-ready. The main colors create a recognizable pop system that can flex across campaigns, fan communities, and digital experiences without losing its performance-driven edge.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors form a triadic system that feels energetic and stage-like, echoing the saturated visual language of KPop without relying on one-note pink or blue tropes. Together they create strong recognition across logos, headlines, and calls to action.
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 triadic system that feels energetic and stage-like, echoing the saturated visual language of KPop without relying on one-note pink or blue tropes. Together they create strong recognition across logos, headlines, and calls to action.
RolesLogo, Btn Primary Bg
Hot Pink delivers the high-voltage pop and fan-centric excitement that makes the brand feel instantly alive.
#FF4F8B255, 79, 139340, 100, 650, 69, 45, 0RolesHeadline, Btn Secondary Bg
Electric Violet adds a sleek performance-night mood and gives the system a more premium, futuristic edge.
#7A3FF2122, 63, 242260, 87, 6050, 74, 0, 5RolesLink, Btn Outlined Border, Btn Outlined Text
Aqua Teal brings a fresh digital accent that keeps the palette dynamic and readable across interactive elements.
#19C6B325, 198, 179173, 78, 4487, 0, 10, 22The support colors extend the pop energy with controlled contrast, adding shine and warmth without competing with the main trio. They help the palette feel more versatile for merch, posters, and interface accents while staying subordinate.
RolesIcon, Border
Apricot softens the intensity with a warm highlight that echoes stage lighting and complements the brighter main colors.
#FFB347255, 179, 7135, 100, 640, 30, 72, 0RolesDivider, Outline
Coral adds a lively transitional tone that bridges pink and violet while keeping secondary UI details energetic.
#FF6F61255, 111, 975, 100, 690, 56, 62, 0Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F4F1EA244, 241, 23442, 31, 940, 1, 4, 4RolesBg Dark, Text, Btn Primary Text
#14141420, 20, 200, 0, 80, 0, 0, 92Copy 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-hot-pink: #FF4F8B;
--color-electric-violet: #7A3FF2;
--color-aqua-teal: #19C6B3;
--color-apricot: #FFB347;
--color-coral: #FF6F61;
--color-white: #FFFFFF;
--color-ivory: #F4F1EA;
--color-charcoal: #141414;
}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: #FF4F8B;
--role-btn-primary-bg: #FF4F8B;
--role-headline: #7A3FF2;
--role-btn-secondary-bg: #7A3FF2;
--role-link: #19C6B3;
--role-btn-outlined-border: #19C6B3;
--role-btn-outlined-text: #19C6B3;
--role-icon: #FFB347;
--role-border: #FFB347;
--role-divider: #FF6F61;
--role-outline: #FF6F61;
--role-bg-light: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-bg-dark: #141414;
--role-text: #141414;
--role-btn-primary-text: #141414;
}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.{
"hot-pink": "#FF4F8B",
"electric-violet": "#7A3FF2",
"aqua-teal": "#19C6B3",
"apricot": "#FFB347",
"coral": "#FF6F61",
"white": "#FFFFFF",
"ivory": "#F4F1EA",
"charcoal": "#141414"
}