A beautiful, interactive web-based color palette generator. Create stunning color combinations with just one click!
- 🎲 Random Generation: Generate harmonious color palettes instantly
- 🔒 Lock Colors: Lock your favorite colors and regenerate the rest
- 📤 Export Options:
- Export as CSS variables
- Export as JSON
- Save as PNG image
- ⌨️ Keyboard Shortcuts: Press spacebar to generate new palette
- 📱 Responsive Design: Works perfectly on all devices
- 🎯 Click to Lock: Click any color to lock/unlock it
Simply open index.html in your browser - no build process required!
- Generate Palettes: Click "Generate New Palette" or press spacebar
- Lock Colors: Click on any color card to lock it (locked colors won't change)
- Export Your Palette:
- CSS: Get CSS custom properties for your project
- JSON: Export palette data for programmatic use
- Image: Save as PNG for design mockups
Space: Generate new palette
- Pure HTML5
- CSS3 (with gradients and animations)
- Vanilla JavaScript (ES6+)
- No dependencies required!
- Web Design: Find color schemes for websites
- Branding: Explore color combinations for brands
- UI/UX: Create cohesive interface color palettes
- Art Projects: Get color inspiration
- Presentations: Generate professional color themes
:root {
--color-1: #A45FB2;
--color-2: #6C89D4;
--color-3: #4BC9B8;
--color-4: #F4A261;
--color-5: #E76F51;
}{
"palette": [
{
"name": "color-1",
"hex": "#A45FB2",
"rgb": { "r": 164, "g": 95, "b": 178 }
}
]
}- Smart Color Generation: Uses HSL color space for harmonious results
- Smooth Animations: Hover effects and transitions
- User-Friendly: Intuitive interface with visual feedback
- No Installation: Just download and open in browser
Feel free to fork, improve, and submit pull requests!
MIT License - feel free to use in your projects!
Created by DonkRonk17
Enjoy creating beautiful color palettes! 🎨✨