PrimaryMisty Harbour#64748b
on white 4.8:1 Lc 73on black 4.1:1 Lc 28Add a colour
Start with one colour, then add only what you need.
Preview
Preview
Misty Harbour
Your brand, in full colour
See every shade working together across a real interface, before you commit a single line of code.
Active users 8.2%
12,840
vs. 11,860 last week
Misty Harbour planPopular
$49/mo
- Unlimited palettes
- Team workspace
Built for your team
- Semantic tokens, ready to ship
- Light and dark, generated for you
- Synced to Figma and Tailwind
Palette saved
Ready to export across nine formats
Palette in use
Primary#7789a2
Export
/* Made with Aesthetic colours - https://colours.aestudio.au */
@theme {
--color-misty-harbour-50: #f3f6fa;
--color-misty-harbour-100: #e2e8f1;
--color-misty-harbour-200: #ccd6e6;
--color-misty-harbour-300: #adbcd2;
--color-misty-harbour-400: #92a4be;
--color-misty-harbour-500: #7789a2;
--color-misty-harbour-600: #64748b;
--color-misty-harbour-700: #526071;
--color-misty-harbour-800: #404b58;
--color-misty-harbour-900: #353e47;
--color-misty-harbour-950: #161b20;
}Every role ships as its own named ramp. Drop the block into your config.