This palette draws inspiration from the uploaded image's bold black, vibrant cobalt blue, and a fresh green that balance authority with approachability, augmented by supportive soft blues and neutrals for clarity and elegance in digital and print use.
This palette draws inspiration from the uploaded image's bold black, vibrant cobalt blue, and a fresh green that balance authority with approachability, augmented by supportive soft blues and neutrals for clarity and elegance in digital and print use.
Each column shows a usable logo color on a palette background, with contrast checked for clarity.
A neutral card system with the logo color, contact text, and a restrained palette accent.
A mobile landing page preview with logo, navigation, headline, CTA, content card, and chart color usage.
The main colors combine a striking black, vibrant cobalt blue, and a fresh green to create a visually balanced and memorable brand system that conveys professionalism with innovation.
Numbers, pie charts, bars, stacked bars, and lines reveal whether the palette can support real product interfaces.
Assign existing palette colors to brand, typography, and interface roles.
CMYK values are calculated from HEX by default. Adjust them only when preparing print materials.
A compact view of the brand, support, and neutral colors that make up this system.
The main colors combine a striking black, vibrant cobalt blue, and a fresh green to create a visually balanced and memorable brand system that conveys professionalism with innovation.
RolesLogo, Btn Primary Bg, Btn Outlined Border
Black provides authority and a strong foundation, serving as a powerful base color for the brand's prominence.
#0000000, 0, 00, 0, 00, 0, 0, 100RolesLink, Btn Secondary Bg, Headline
Cobalt Blue injects energy and trustworthiness, making it ideal for interactive elements and headlines that need attention.
#0047AB0, 71, 171215, 100, 34100, 58, 0, 33RolesBtn Outlined Text
Sea Green adds freshness and approachability, complementing the stronger blue and black with a natural vibrancy.
#2E8B5746, 139, 87146, 50, 3667, 0, 37, 45Support colors extend the main palette with softer blues that harmonize with cobalt and green, and a muted gray that balances vibrancy for better visual comfort and usability.
RolesIcon, Border, Divider
Light Steel Blue offers a softer variation of the main blue for subtle accents and interface elements, reducing visual strain.
#66A3D2102, 163, 210206, 55, 6151, 22, 0, 18RolesOutline
Pale Green provides a gentle complement to Sea Green, enhancing balance and calmness in supporting visuals.
#A9CBB7169, 203, 183145, 25, 7317, 0, 10, 20Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0RolesBg Dark
#F4F4F4244, 244, 2440, 0, 960, 0, 0, 4RolesText
#22222234, 34, 340, 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-black: #000000;
--color-cobalt-blue: #0047AB;
--color-sea-green: #2E8B57;
--color-light-steel-blue: #66A3D2;
--color-pale-green: #A9CBB7;
--color-white: #FFFFFF;
--color-cultured: #F4F4F4;
--color-jet-black: #222222;
}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: #000000;
--role-btn-primary-bg: #000000;
--role-btn-outlined-border: #000000;
--role-link: #0047AB;
--role-btn-secondary-bg: #0047AB;
--role-headline: #0047AB;
--role-btn-outlined-text: #2E8B57;
--role-icon: #66A3D2;
--role-border: #66A3D2;
--role-divider: #66A3D2;
--role-outline: #A9CBB7;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-bg-dark: #F4F4F4;
--role-text: #222222;
}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.{
"black": "#000000",
"cobalt-blue": "#0047AB",
"sea-green": "#2E8B57",
"light-steel-blue": "#66A3D2",
"pale-green": "#A9CBB7",
"white": "#FFFFFF",
"cultured": "#F4F4F4",
"jet-black": "#222222"
}