This startup-inspired palette pairs a crisp electric blue with a forward-looking violet and a sharp cyan for a clean, ambitious digital identity. The neutrals keep the system fast, readable, and product-friendly across interfaces and brand touchpoints.
This startup-inspired palette pairs a crisp electric blue with a forward-looking violet and a sharp cyan for a clean, ambitious digital identity. The neutrals keep the system fast, readable, and product-friendly across interfaces and brand touchpoints.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
Electric blue, violet, and cyan create a high-energy startup system that feels agile, innovative, and product-ready without relying on a generic corporate blue scheme. The relationship stays recognizable across brand and interface use while still feeling distinct and contemporary.
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.
Electric blue, violet, and cyan create a high-energy startup system that feels agile, innovative, and product-ready without relying on a generic corporate blue scheme. The relationship stays recognizable across brand and interface use while still feeling distinct and contemporary.
RolesLogo, Btn Primary Bg
Royal Blue gives the brand its confident core and communicates speed, trust, and technical clarity.
#2563EB37, 99, 235221, 83, 5384, 58, 0, 8RolesHeadline
Violet adds a venture-scale sense of innovation and helps key messaging feel more ambitious.
#7C3AED124, 58, 237262, 83, 5848, 76, 0, 7RolesLink, Btn Secondary Bg, Btn Outlined Border, Btn Outlined Text
Cyan adds an alert, digital edge that keeps the system lively and gives secondary actions strong visibility.
#06B6D46, 182, 212189, 94, 4397, 14, 0, 17The support colors stay restrained and reinforce the startup energy without competing with the main blues and violet. They add structure, clarity, and subtle depth for UI accents and brand details.
RolesIcon
Slate Blue softens the interface and supports icons with a cool, product-oriented tone.
#8B9BB4139, 155, 180217, 21, 6323, 14, 0, 29RolesBorder
Blue Gray provides clean separation for components while staying quiet beside the brighter accents.
#B7C3D0183, 195, 208211, 21, 7712, 6, 0, 18Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F5F7FA245, 247, 250216, 33, 972, 1, 0, 2RolesBg Dark, Divider, Outline, Text, Btn Secondary Text
#0F172A15, 23, 42222, 47, 1164, 45, 0, 84Copy 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-royal-blue: #2563EB;
--color-violet: #7C3AED;
--color-cyan: #06B6D4;
--color-slate-blue: #8B9BB4;
--color-blue-gray: #B7C3D0;
--color-white: #FFFFFF;
--color-snow: #F5F7FA;
--color-charcoal: #0F172A;
}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: #2563EB;
--role-btn-primary-bg: #2563EB;
--role-headline: #7C3AED;
--role-link: #06B6D4;
--role-btn-secondary-bg: #06B6D4;
--role-btn-outlined-border: #06B6D4;
--role-btn-outlined-text: #06B6D4;
--role-icon: #8B9BB4;
--role-border: #B7C3D0;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-bg-dark: #0F172A;
--role-divider: #0F172A;
--role-outline: #0F172A;
--role-text: #0F172A;
--role-btn-secondary-text: #0F172A;
}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.{
"royal-blue": "#2563EB",
"violet": "#7C3AED",
"cyan": "#06B6D4",
"slate-blue": "#8B9BB4",
"blue-gray": "#B7C3D0",
"white": "#FFFFFF",
"snow": "#F5F7FA",
"charcoal": "#0F172A"
}