This palette is inspired by the natural and digital blend in the image, featuring a harmonious mix of vibrant green, soft blue, and warm sunset hues to evoke growth, innovation, and optimism. The main colors are balanced with muted earth tones for subtle support, complemented by a comprehensive neutral set for readability and depth.
This palette is inspired by the natural and digital blend in the image, featuring a harmonious mix of vibrant green, soft blue, and warm sunset hues to evoke growth, innovation, and optimism. The main colors are balanced with muted earth tones for subtle support, complemented by a comprehensive neutral set for readability and depth.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors combine vibrant green, soft blue, and warm orange-yellow to symbolize growth, clarity, and positive energy, creating a visually cohesive and uplifting harmony.
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 combine vibrant green, soft blue, and warm orange-yellow to symbolize growth, clarity, and positive energy, creating a visually cohesive and uplifting harmony.
RolesLogo, Link, Btn Primary Bg, Btn Outlined Border, Btn Outlined Text, Headline
Forest Green instills a sense of growth, stability, and natural harmony, perfect for brands anchored in innovation and sustainability.
#4CAF5076, 175, 80122, 39, 4957, 0, 54, 31RolesBtn Secondary Bg
Cerulean Blue offers calmness, trust, and clarity, balancing vibrancy with professionalism ideal for digital technology environments.
#2196F333, 150, 243207, 90, 5486, 38, 0, 5Amber injects warmth, optimism, and energy, adding a friendly and inviting glow that complements the cool primary hues.
#FFC107255, 193, 745, 100, 510, 24, 97, 0Support colors extend the main palette with softer, muted hues, providing subtle accents and balancing vibrancy for visual hierarchy and usability.
RolesIcon, Border, Divider, Outline
Moss Green gently reinforces the main green with a lower saturation, giving depth and softness without competing with primary tones.
#8BC34A139, 195, 7488, 50, 5329, 0, 62, 24RolesBg Light
Sky Blue offers a gentle, airy background tone that supports the main blues while enhancing the overall brightness and approachability.
#90CAF9144, 202, 249207, 90, 7742, 19, 0, 2Utility colors for backgrounds, text, borders, and balance.
RolesBg Dark
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F5F5F5245, 245, 2450, 0, 960, 0, 0, 4RolesText, Btn Primary Text, Btn Secondary Text
#21212133, 33, 330, 0, 130, 0, 0, 87Copy palette values for design systems, websites, and client handoff. You can also copy this palette for Logo Export on myLogo.review, so your colors are ready there in one click.
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-forest-green: #4CAF50;
--color-cerulean-blue: #2196F3;
--color-amber: #FFC107;
--color-moss-green: #8BC34A;
--color-sky-blue: #90CAF9;
--color-white: #FFFFFF;
--color-cultured: #F5F5F5;
--color-charcoal: #212121;
}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: #4CAF50;
--role-link: #4CAF50;
--role-btn-primary-bg: #4CAF50;
--role-btn-outlined-border: #4CAF50;
--role-btn-outlined-text: #4CAF50;
--role-headline: #4CAF50;
--role-btn-secondary-bg: #2196F3;
--role-icon: #8BC34A;
--role-border: #8BC34A;
--role-divider: #8BC34A;
--role-outline: #8BC34A;
--role-bg-light: #90CAF9;
--role-bg-dark: #FFFFFF;
--role-text: #212121;
--role-btn-primary-text: #212121;
--role-btn-secondary-text: #212121;
}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.{
"forest-green": "#4CAF50",
"cerulean-blue": "#2196F3",
"amber": "#FFC107",
"moss-green": "#8BC34A",
"sky-blue": "#90CAF9",
"white": "#FFFFFF",
"cultured": "#F5F5F5",
"charcoal": "#212121"
}