# Color Palette Generator | Marketing Color Schemes > Create professional color palettes for marketing campaigns, brand identity, and design projects. Generate harmonious color schemes with accessibility compliance and export options. The Color Palette Generator is a free in-browser tool for building cohesive brand and campaign color systems. Pick a base color, choose a harmony (complementary, analogous, triadic, split-complementary), and the tool produces a balanced palette with hex/RGB/HSL values plus accessibility-compliant text-on-background guidance. ## Features ### Palette Generation - **Color Harmonies**: Complementary, analogous, triadic, split-complementary, monochromatic - **Base Color Input**: Hex picker or named-color entry with live preview - **Tint & Shade Variants**: Lighter/darker steps for each base color - **Accessibility Check**: WCAG AA / AAA contrast ratios against light and dark backgrounds ### Export Options - **Hex / RGB / HSL** values for every color - **CSS Variables** snippet ready to drop into a `:root` block - **Design Tool Tokens**: Compatible with Figma, Tailwind config, and brand systems ### Use Cases - **Campaign Branding**: Build a consistent palette for an ad campaign or product launch - **Brand System**: Lock in primary/secondary/accent colors with documented ratios - **Ad Creative**: Source on-brand colors for ad mockups, social posts, banners - **Email Templates**: Pick accessible color pairs for marketing email design - **Presentations**: Generate a cohesive deck palette in seconds ## Frequently Asked Questions ### How do I pick a brand color? Start from your existing brand identity if you have one — pull the dominant color from your logo or established marketing materials. If you're starting from scratch, choose a base color that reflects your brand personality (warm reds/oranges for energetic, cool blues/greens for trustworthy, neutrals for premium). Then use a harmony rule to derive complementary colors that work alongside the base. ### What's the difference between complementary and analogous harmonies? Complementary colors sit opposite each other on the color wheel (high contrast — best for accents and calls-to-action). Analogous colors sit next to each other (low contrast — best for backgrounds, gradients, and unified moods). Triadic harmonies use three colors evenly spaced on the wheel for vibrant, balanced palettes. ### How many colors should a brand palette have? A core palette typically has 3-5 colors: one primary, one or two secondary, and one or two accents. Add neutrals (light gray, dark gray, off-white) for typography and backgrounds. Avoid going past 7 — palettes that wide become hard to apply consistently across ad creative, web, and email. ### What does WCAG accessibility mean for my palette? WCAG (Web Content Accessibility Guidelines) AA-level contrast requires a 4.5:1 contrast ratio between text and background for normal-size text, 3:1 for large text. AAA-level requires 7:1 and 4.5:1 respectively. The Color Palette Generator flags any text-on-background pair that fails AA so you can choose accessible combinations from the start. ### Can I export the palette for Figma or Tailwind? Yes — the tool emits CSS variable declarations and design-token-compatible color codes that can be pasted directly into Figma color styles, a Tailwind `theme.extend.colors` block, or any other design-system tool that consumes hex/RGB values. ## Best Practices - **Start with one or two anchors**: Don't try to design a 7-color palette from scratch. Pick a primary + one accent, then add neutrals. - **Test contrast for every text/background pair**: Failing accessibility ratios cost real revenue on landing pages and ad CTAs. - **Reserve one bright accent for CTAs**: Use it sparingly so it visually pulls focus. - **Document the palette**: Save hex values, CSS variables, and intended use cases so the same colors get applied consistently across channels. ## Related Tools - [Browser Mockup Generator](/resources/tools/generators/browser-mockup-generator.md) - Apply palette to product screenshots - [Social Media Post Mockup Generator](/resources/tools/generators/social-media-post-mockup-generator.md) - Test palette on social proof mockups - [Screenshot Beautifier](/resources/tools/generators/screenshot-beautifier.md) - Polish screenshots with on-brand backgrounds - [Creative Quality Grader](/resources/tools/analyzers/creative-quality-grader.md) - Evaluate creative against brand standards ## Additional Resources - [Marketing Glossary](/resources/glossary) - Comprehensive definitions of marketing terms - [Visual Identity (glossary)](/resources/glossary/creative/visual-identity) - Foundational visual-system concepts - [Brand Guidelines (glossary)](/resources/glossary/creative/brand-guidelines) - Documenting brand standards