Welcome to the Badge Maker Lite! This project is a React-based tool that allows you to create custom SVG badges with personalized text, colors, and layouts. The application is user-friendly, providing real-time previews of your designs and offering features to save and load badge configurations.
- Text Customization: Customize the label and hint text on your badge.
- Font Size Control: Adjust the font size for both the label and hint text.
- Layout Control: Adjust the width, height, and divider line of the badge.
- Color Customization: Customize the background and text colors for both the label and hint sections.
- Live Preview: See real-time updates as you adjust your badge design.
- SVG Code Output: Easily copy the generated SVG code to use in your projects.
- Save and Load Feature: Save your badge configurations to GitHub Gists and load them later using a unique UUID.
Visit the github pages of this repo, and you can create badges like these:
Once you’ve configured your badge, click the "Save Badge" button. The badge configuration will be saved to a GitHub Gist, and you’ll be provided with a unique URL that you can use to load your badge later.
To load a previously saved badge, enter the UUID (the unique identifier provided after saving) into the input field and click the "Load Badge" button. The application will retrieve the configuration from GitHub and update the badge accordingly.
Contributions are welcome! Please see the CONTRIBUTING.md file for guidelines on how to contribute to this project.
This project follows a Code of Conduct to ensure a welcoming environment for all contributors. By participating in this project, you agree to abide by its terms.
This project is licensed under the MIT License - see the LICENSE file for details.
If you find this project useful and would like to see more improvements, consider supporting it through Ko-Fi. Your support is greatly appreciated!
