This palette turns the image’s bold stripe-like energy into a structured brand system with vivid lime and a warmer pink-red accent balanced by a deep forest green and warm blush. The contrast feels modern and expressive, while the neutrals keep the identity clean and usable across interfaces.
This palette turns the image’s bold stripe-like energy into a structured brand system with vivid lime and a warmer pink-red accent balanced by a deep forest green and warm blush. The contrast feels modern and expressive, while the neutrals keep the identity clean and usable across interfaces.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors recreate the image’s energetic striped contrast in a way that feels intentional and brand-ready. Lime and the warmer magenta-red keep the system high-impact and fashion-led, while Ivory anchors the palette with a lighter, polished edge.
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 recreate the image’s energetic striped contrast in a way that feels intentional and brand-ready. Lime and the warmer magenta-red keep the system high-impact and fashion-led, while Ivory anchors the palette with a lighter, polished edge.
RolesLogo, Btn Primary Bg, Headline
Lime adds sharp visibility and a fresh, confident signal that makes the brand feel current and energetic.
#A9CF2A169, 207, 4274, 66, 4918, 0, 80, 19RolesLink, Btn Secondary Bg
Raspberry brings expressive momentum and helps the palette feel more fashion-led and memorable.
#D93672217, 54, 114338, 68, 530, 75, 47, 15Ivory softens the intensity of the brighter hues and gives the system a light, polished resting point.
#F5EFD2245, 239, 21050, 64, 890, 2, 14, 4The support colors extend the palette with muted warmth and a deeper grounded accent so the bright main colors stay balanced. They add flexibility for interface states, depth, and subtle emphasis without competing with the core stripes.
RolesIcon, Border, Divider
Forest Green gives supporting UI elements a darker, more grounded anchor that still feels connected to the lime family.
#1E3A1A30, 58, 26113, 38, 1648, 0, 55, 77RolesOutline, Btn Outlined Border
Rose softens the magenta-red into a lighter accent that works well for delicate outlines and restrained emphasis.
#E8A3BE232, 163, 190337, 60, 770, 30, 18, 9Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0RolesBtn Outlined Text
#F8F4EA248, 244, 23443, 50, 950, 2, 6, 3RolesBg Dark, Text, Btn Primary Text
#1B1B1F27, 27, 31240, 7, 1113, 13, 0, 88Copy 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-lime: #A9CF2A;
--color-raspberry: #D93672;
--color-ivory: #F5EFD2;
--color-forest-green: #1E3A1A;
--color-rose: #E8A3BE;
--color-white: #FFFFFF;
--color-eggshell: #F8F4EA;
--color-charcoal: #1B1B1F;
}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: #A9CF2A;
--role-btn-primary-bg: #A9CF2A;
--role-headline: #A9CF2A;
--role-link: #D93672;
--role-btn-secondary-bg: #D93672;
--role-icon: #1E3A1A;
--role-border: #1E3A1A;
--role-divider: #1E3A1A;
--role-outline: #E8A3BE;
--role-btn-outlined-border: #E8A3BE;
--role-bg-light: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-btn-outlined-text: #F8F4EA;
--role-bg-dark: #1B1B1F;
--role-text: #1B1B1F;
--role-btn-primary-text: #1B1B1F;
}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.{
"lime": "#A9CF2A",
"raspberry": "#D93672",
"ivory": "#F5EFD2",
"forest-green": "#1E3A1A",
"rose": "#E8A3BE",
"white": "#FFFFFF",
"eggshell": "#F8F4EA",
"charcoal": "#1B1B1F"
}