A curated library of ready-to-use color palettes. Each combination comes with hex codes you can copy instantly, a mood description, and suggested use cases. Click any hex code to copy it to your clipboard.
Nordic Slate
Refined, minimal, authoritative
Ideal for B2B software, professional services, law firms, and consultancy websites. The cool gray scale conveys competence, while the single blue accent creates a clear interactive focal point without distraction.
:root {
--bg: #F8F9FA;
--border: #DEE2E6;
--muted: #868E96;
--text: #343A40;
--accent: #3A86FF;
}
Cloud White
Clean, timeless, trustworthy
A timeless palette for SaaS products, documentation sites, and developer portfolios. The pure white surface combined with a slightly blue-tinted gray creates the feeling of a well-lit, well-organized workspace.
:root {
--bg: #FFFFFF;
--surface: #F1F3F5;
--border: #CED4DA;
--text: #495057;
--accent: #0066CC;
}
Ink & Sage
Sophisticated, calm, editorial
Warm off-white with warm neutrals and a forest green accent. Works well for editorial publications, premium editorial blogs, wellness brands, and any project where you want a modern but grounded aesthetic.
:root {
--bg: #FAFAF8;
--surface: #E8E8E3;
--border: #B8B8AF;
--text: #4A4A3F;
--accent: #2D6A4F;
}
Corporate Navy
Trustworthy, serious, established
A monochromatic blue scale that projects institutional credibility. The go-to palette for banking, insurance, healthcare systems, and government digital services where trust and reliability are the primary message.
:root {
--bg: #F0F4F8;
--surface: #D9E2EC;
--mid: #9FB3C8;
--text: #334E68;
--primary: #003366;
}
Ivory & Ink
Warm, refined, literary
Warm paper tones with near-black text. Excellent for long-form reading experiences, journaling apps, book and publishing brands, and any product where text legibility and reading comfort are paramount.
:root {
--bg: #FFFFF0;
--surface: #F5F0E8;
--border: #D4C5A9;
--accent: #5C4A2A;
--text: #1A1A1A;
}
Desert Bloom
Warm, earthy, grounded
Terra cotta, amber, and deep brown. Perfect for interior design brands, architecture firms, ceramic and craft studios, and Mediterranean-inspired food and travel brands. Evokes warmth, natural materials, and handcraft.
:root {
--bg: #FFF3E0;
--warm-1: #FFCC80;
--warm-2: #FF8A65;
--accent: #BF360C;
--dark: #4E342E;
}
Autumn Harvest
Cozy, rich, inviting
Golden amber flowing into deep chocolate brown. A signature palette for specialty coffee shops, artisan bakeries, whiskey brands, and autumn seasonal marketing campaigns. Communicates richness and warmth.
:root {
--bg: #FFF8E1;
--gold: #FFE082;
--amber: #D4A056;
--brown: #8D4E1A;
--dark: #3E2723;
}
Sahara Sand
Natural, timeless, understated
A neutral sand and tan scale with no cool undertones. Excellent for luxury travel brands, handmade goods marketplaces, minimalist lifestyle brands, and any project that needs to feel natural without being dramatic.
:root {
--bg: #FDF6EC;
--sand: #F5DEB3;
--tan: #D2B48C;
--earth: #8B7355;
--dark: #3D2B1A;
}
Aged Leather
Classic, durable, masculine
Cream and leather brown tones that evoke craftsmanship and longevity. Well-suited for leather goods brands, men's grooming products, whiskey and cigar brands, classic car restoration, and heritage outdoor apparel.
:root {
--bg: #F5F0EB;
--cream: #E8D5C0;
--leather: #C4956A;
--brown: #8B5E3C;
--dark: #4A2E1A;
}
Spice Market
Vibrant, flavorful, energetic
Golden yellow through vivid orange to deep red-orange. High-energy palette for food delivery apps, restaurant brands, street food markets, and any product where appetite and enthusiasm are the core feelings to evoke.
:root {
--bg: #FFF5E6;
--light: #FFD180;
--mid: #FF9800;
--warm: #E65100;
--deep: #BF360C;
}
Ocean Mist
Calming, fresh, healing
A full teal scale from pale aqua to deep teal. Conveys cleanliness and calm — ideal for healthcare products, dental and medical practices, spa and wellness brands, mental health apps, and eco-friendly cleaning products.
:root {
--bg: #E0F7FA;
--light: #80DEEA;
--mid: #26C6DA;
--deep: #00838F;
--dark: #004D54;
}
Nordic Sky
Modern, reliable, optimistic
A bright blue scale popularized by modern SaaS products. The lightest tones work for backgrounds and cards, while the vivid mid-blue is a strong primary button color. Used widely in productivity tools, fintech, and social platforms.
:root {
--bg: #EFF6FF;
--surface: #BFDBFE;
--light: #60A5FA;
--primary: #2563EB;
--dark: #1E3A8A;
}
Forest Mint
Natural, fresh, balanced
Pale mint through rich forest green. A natural growth palette for sustainability startups, plant-based food brands, health and fitness apps, and financial products focused on investment growth and positive returns.
:root {
--bg: #F0FFF4;
--surface: #C6F6D5;
--mid: #68D391;
--forest: #276749;
--dark: #1A4731;
}
Lavender Dusk
Creative, imaginative, premium
Soft lavender to deep royal purple. Communicates creativity and sophistication — popular for beauty brands, mental wellness apps, astrology and spiritual products, design tools, and any SaaS targeting a predominantly creative audience.
:root {
--bg: #FAF5FF;
--surface: #E9D8FD;
--mid: #9F7AEA;
--primary: #6B46C1;
--dark: #44337A;
}
Glacier
Icy, crisp, expansive
Brilliant sky blue with high brightness. Great for aviation, clean technology, water brands, winter sports gear, and any product that wants to communicate purity, clarity, and scale. The vivid mid-blue makes an excellent call-to-action color.
:root {
--bg: #F0F9FF;
--surface: #BAE6FD;
--sky: #38BDF8;
--primary: #0284C7;
--deep: #0C4A6E;
}
Cherry Blossom
Delicate, romantic, joyful
A full pink gradient from the palest blush to saturated rose. Ideal for beauty and skincare brands, bridal and wedding services, baby products, women's fashion, and seasonal spring marketing campaigns.
:root {
--bg: #FFF0F6;
--blush: #FFD6EC;
--petal: #FFB3D9;
--pink: #FF80BF;
--deep: #CC3380;
}
Morning Honey
Cheerful, warm, welcoming
Creamy yellows with a warm amber accent. Optimistic and welcoming — works for children's education platforms, lifestyle and newsletter brands, morning routine apps, food blogs, and seasonal summer campaigns.
:root {
--bg: #FFFBF0;
--cream: #FEF3C7;
--pale: #FDE68A;
--amber: #F59E0B;
--dark: #92400E;
}
Garden Mist
Fresh, natural, gentle
Pale mint green through vivid emerald. Communicates freshness, health, and positive momentum. Excellent for plant care apps, health and diet trackers, wellness subscription boxes, and environmental charities.
:root {
--bg: #F0FFF4;
--light: #D1FAE5;
--mint: #A7F3D0;
--green: #34D399;
--dark: #065F46;
}
Peach Blossom
Warm, friendly, approachable
Soft peach tones moving from cream to warm coral. Feels approachable and sociable. Great for community platforms, food and brunch cafes, social apps, and lifestyle subscription services targeting a warm, friendly tone.
:root {
--bg: #FFF5F0;
--soft: #FEDDCA;
--peach: #FBBEAB;
--coral: #F4845F;
--deep: #C45A3B;
}
Lilac Dream
Dreamy, imaginative, elegant
Pale lilac to vivid violet. Captures imagination and premium quality simultaneously. Popular for design and creative software interfaces, luxury beauty products, AI brand identities, and any product that wants to feel innovative and slightly magical.
:root {
--bg: #F8F4FF;
--surface: #EDE0FF;
--lilac: #D4B8FF;
--violet: #9B6DFF;
--deep: #5B2DA8;
}
Golden Hour
Energetic, warm, confident
Yellow to deep orange — the palette of sunset and golden light. High-energy and optimistic. Works well for delivery apps, marketplace platforms, creator economy tools, and any product that should feel fast, warm, and accessible.
:root {
--bg: #FFFDE7;
--pale: #FFF176;
--yellow: #FFCA28;
--orange: #F57F17;
--deep: #E65100;
}
Neon Jungle
Electric, alive, bold
Neon lime through vivid green to deep forest. Maximum energy. Best for gaming interfaces, sports and fitness brands targeting Gen-Z, extreme sports gear, esports platforms, and any brand that needs to project raw vitality.
:root {
--bg: #F5FBEF;
--neon: #ADFF2F;
--vivid: #00E676;
--teal: #00BFA5;
--dark: #1B5E20;
}
Hot Fuchsia
Bold, confident, expressive
A bold monochromatic pink that signals confidence and self-expression. Excellent for cosmetics, fashion brands, pop culture, music streaming interfaces, and any product that wants to make a strong first impression with a female-skewing audience.
:root {
--bg: #FCE4EC;
--light: #F48FB1;
--vivid: #EC407A;
--deep: #AD1457;
--dark: #880E4F;
}
Deep Amethyst
Luxurious, mystical, premium
Rich purple scale from pale lavender to deep amethyst. Communicates luxury, creativity, and ambition. Used by premium beauty brands, spiritual and wellness platforms, luxury subscription services, and premium tier upsells.
:root {
--bg: #EDE7F6;
--light: #CE93D8;
--mid: #AB47BC;
--purple: #6A1B9A;
--dark: #4A148C;
}
Blueprint
Precise, dynamic, structured
Deep blue primary with a vivid amber-orange complementary accent. This pairing creates strong visual contrast and a feeling of precision and energy. Used in engineering, architecture tools, manufacturing brands, and sports analytics platforms.
:root {
--bg: #E3F2FD;
--light: #64B5F6;
--primary: #1565C0;
--accent: #FF6F00;
--text: #212121;
}
Midnight Studio
Focused, immersive, professional
A pure neutral dark mode stack. The foundation of code editors, creative software, and developer-focused tools. The near-black backgrounds with elevated surfaces create depth without color, and pure white text provides maximum readability contrast.
:root {
--bg: #0F0F0F;
--surface: #1E1E1E;
--elevated: #2E2E2E;
--muted: #888888;
--text: #FFFFFF;
}
Deep Ocean
Serious, secure, authoritative
Very deep navy to mid ocean blue. Projects security and depth. The standard choice for cybersecurity platforms, enterprise software dashboards, fintech dark modes, and defense/aerospace brands that need to look uncompromising.
:root {
--bg: #0A1628;
--surface: #0D2137;
--mid: #1B4F72;
--bright: #2E86C1;
--light: #85C1E9;
}
Obsidian & Gold
Luxurious, exclusive, powerful
Near-black with gold accents — the most iconic luxury color combination. Used for premium membership tiers, jewelry brands, private banking interfaces, exclusive event promotions, and any product where price or exclusivity is a selling point.
:root {
--bg: #0D0D0D;
--surface: #1A1A1A;
--border: #2E2E2E;
--gold: #B8860B;
--shine: #FFD700;
}
Dark Forest
Grounded, resilient, natural
Very dark green through forest to bright leaf green. A compelling dark mode palette for sustainability tech, outdoor gear brands, environmental nonprofits, and products that want to communicate authentic connection to nature in a sophisticated way.
:root {
--bg: #0F1A0F;
--surface: #1A3320;
--mid: #2E5C2E;
--bright: #52A052;
--light: #A0D080;
}
Cosmic Night
Mysterious, futuristic, bold
Deep purple-black to vivid violet. Futuristic and immersive — a popular palette for AI and ML products, gaming and esports, NFT and crypto platforms, streaming services, and VR/AR applications that want to feel like they exist slightly outside of everyday reality.
:root {
--bg: #1A0F22;
--surface: #2D1B3D;
--mid: #5C2E7A;
--vivid: #A855F7;
--pale: #E9D5FF;
}