🖌️
Color Palette Generator
Generate beautiful color palettes from a base color
Lighter
#eee7fe
Light
#ba9efa
Base
#8b5cf6
Dark
#4d0ce0
Analogous
#d85cf6
Analogous 2
#5c7af6
Complementary
#c7f65c
About This Calculator
A color palette generator helps developers and designers create harmonious color schemes from a single base color. This tool generates a set of swatches including lighter and darker variations of the base color, analogous colors, and a complementary color. Each swatch displays its HEX value ready to copy into your stylesheets or design tokens. Use it when building design systems, choosing brand colors, theming applications, or finding coordinated colors that work well together.
How to Use
- 1Pick a base colorChoose a starting color using the color picker or enter a HEX value.
- 2View generated swatchesSee lighter, darker, analogous, and complementary color variations generated from your base color.
- 3Copy colorsClick on any swatch to copy its HEX value for use in your project.
Frequently Asked Questions
Q. What is a complementary color scheme?
Complementary colors sit opposite each other on the color wheel (e.g., blue and orange). They create high contrast and strong visual impact. Use one as the dominant color and the other as an accent for call-to-action buttons or highlights.
Q. How do I create an accessible color palette?
To ensure accessibility, use a separate contrast checker tool to verify that text and background color combinations from your palette meet WCAG contrast ratio requirements (at least 4.5:1 for normal text and 3:1 for large text).
Q. What are design tokens and how do color palettes relate?
Design tokens are named values (like --color-primary-500) that store design decisions. A well-structured color palette maps directly to tokens, making it easy to maintain consistent theming across components and switch between light and dark modes.
Disclaimer: Results are for informational purposes only and do not constitute professional advice. Always consult qualified professionals for important decisions.