https://github.com/themiu/random-color-palette-generator-with-svg-export
🎲 Random Color Palette Generator 🎨 with SVG Export
https://github.com/themiu/random-color-palette-generator-with-svg-export
color-palette color-theme random-color-generator svg
Last synced: 6 months ago
JSON representation
🎲 Random Color Palette Generator 🎨 with SVG Export
- Host: GitHub
- URL: https://github.com/themiu/random-color-palette-generator-with-svg-export
- Owner: TheMIU
- Created: 2024-08-23T09:29:48.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-09-16T11:47:43.000Z (about 1 year ago)
- Last Synced: 2025-02-01T20:29:50.253Z (8 months ago)
- Topics: color-palette, color-theme, random-color-generator, svg
- Language: JavaScript
- Homepage: https://themiu.github.io/random-color-palette-generator-with-svg-export/
- Size: 6.84 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
Awesome Lists containing this project
README
# 🎲 Random Color Palette Generator 🎨 + SVG Export
This is a simple web-based tool to generate random color palettes with 2 to 7 colors. You can export the generated palette as an SVG file and toggle between light and dark modes using a sticky button to see how colors look in different themes.
## Demo
🔗 https://themiu.github.io/random-color-palette-generator-with-svg-export/
## Features
- Generate random color palettes of 2 to 7 colors.
- Export the generated palette as an SVG file.
- Sticky dark mode button to see how colors look in different themes.
## Technologies Used
- **HTML5**: Structure of the web page.
- **CSS3**: For layout, styling, and making the dark mode toggle button sticky.
- **Bootstrap 4**: For responsive design and styling.
- **JavaScript (ES6)**: Core logic for generating colors, exporting SVG, and toggling dark mode.
- **Font Awesome**: Icons used for light/dark mode (sun/moon).
## How to Use
1. Open the app in a browser.
2. Set the number of colors you want to generate (between 2 and 7).
3. Click the "Generate Palette" button to create the random color palette.
4. The generated colors will display as blocks with their hex codes.
5. Click the "Export as SVG" button to download the palette as an SVG file.
6. Use the sticky dark mode button on the top-right corner to toggle between light and dark modes.
7. **Test your palette**: Toggle between light and dark modes to see how the generated colors work on different backgrounds (light and dark themes).