CSS Button Generator is a simple and user-friendly tool that helps developers and designers create beautiful and customizable CSS buttons with ease. This tool allows users to adjust button appearance, hover effects, and generate ready-to-use CSS code.
- Background Options:
- Solid colors or gradient backgrounds.
- Border Settings:
- Adjustable border radius and width.
- Font Customization:
- Change text color, font family, and font size.
- Add hover animations like:
- Scaling.
- Opacity changes.
- Shadow effects.
- Background transitions.
- Instantly preview your customized button design in real-time.
- Automatically generates the CSS code for your customized button.
- Copy and paste the code directly into your project.
- Clone or Download the repository:
git clone https://github.com/Muhammad-Noraeii/CSS-Button-Generator.git
- Open the
index.html
file in your browser. - Customize the button using the tool:
- Adjust appearance settings (background, font, border).
- Apply hover effects as needed.
- Copy the generated CSS code from the code section.
Here's how the tool looks:
Note: This is first version of CSS Button Generator
- HTML5
- CSS3
- JavaScript
Contributions are welcome! If you have ideas to improve this project, feel free to fork the repository and submit a pull request.
- Fork the repository.
- Create a new branch:
git checkout -b feature-name
- Commit your changes:
git commit -m "Add your feature or fix description"
- Push to your branch:
git push origin feature-name
- Open a pull request.
This project is licensed under the MIT License. See the LICENSE file for details.