This palette uses a harmonious triadic scheme to balance credibility, warmth, and approachability for Pilates professionals. The main colors establish trust and optimism while the support colors provide subtle sophistication and calm, complemented by neutrals that enhance readability and a clean, minimal feel.
This palette uses a harmonious triadic scheme to balance credibility, warmth, and approachability for Pilates professionals. The main colors establish trust and optimism while the support colors provide subtle sophistication and calm, complemented by neutrals that enhance readability and a clean, minimal feel.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main triadic colors combine a fresh Teal, an optimistic Coral, and a grounded Slate to express trust, warmth, and professionalism in a balanced and memorable way.
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 triadic colors combine a fresh Teal, an optimistic Coral, and a grounded Slate to express trust, warmth, and professionalism in a balanced and memorable way.
RolesLogo, Btn Primary Bg, Btn Outlined Border
Teal conveys stability, trust, and a fresh modern feel ideal for a credible yet inviting wellness brand.
#0080800, 128, 128180, 100, 25100, 0, 0, 50RolesLink, Btn Secondary Bg, Btn Outlined Text
Coral introduces warmth, energy, and optimism, making the brand approachable and human.
#FF6B61255, 107, 974, 100, 690, 58, 62, 0RolesHeadline
Slate adds grounded sophistication and professionalism, anchoring the palette with a calm yet confident tone.
#556B7A85, 107, 122204, 18, 4130, 12, 0, 52The subdued Morganite Pink and Dusty Blue support colors quietly accent the main palette, adding softness and balance without competing, thus enhancing the brand's welcoming and elevated character.
RolesIcon, Border
Morganite Pink complements Coral by adding a muted softness that supports warmth without overwhelming.
#C7A9A1199, 169, 16113, 25, 710, 15, 19, 22RolesDivider, Outline
Dusty Blue balances the stronger teals and corals with a gentle, calming presence that reinforces professionalism.
#7895A1120, 149, 161198, 18, 5525, 7, 0, 37Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0RolesBg Dark
#F4F4F4244, 244, 2440, 0, 960, 0, 0, 4RolesText, Btn Secondary Text
#2E2E2E46, 46, 460, 0, 180, 0, 0, 82Copy 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-teal: #008080;
--color-coral: #FF6B61;
--color-slate: #556B7A;
--color-morganite-pink: #C7A9A1;
--color-dusty-blue: #7895A1;
--color-white: #FFFFFF;
--color-ivory: #F4F4F4;
--color-charcoal: #2E2E2E;
}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: #008080;
--role-btn-primary-bg: #008080;
--role-btn-outlined-border: #008080;
--role-link: #FF6B61;
--role-btn-secondary-bg: #FF6B61;
--role-btn-outlined-text: #FF6B61;
--role-headline: #556B7A;
--role-icon: #C7A9A1;
--role-border: #C7A9A1;
--role-divider: #7895A1;
--role-outline: #7895A1;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-bg-dark: #F4F4F4;
--role-text: #2E2E2E;
--role-btn-secondary-text: #2E2E2E;
}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.{
"teal": "#008080",
"coral": "#FF6B61",
"slate": "#556B7A",
"morganite-pink": "#C7A9A1",
"dusty-blue": "#7895A1",
"white": "#FFFFFF",
"ivory": "#F4F4F4",
"charcoal": "#2E2E2E"
}