CSS Box Shadow Generator

The CSS Box Shadow Generator is a web-based tool that allows users to create and customize box shadows for their web projects. With this generator, users can easily adjust various parameters such as shadow color, blur radius, spread radius, shift right, shift down, border radius, and apply transformations like translateX, translateY, skewX, skewY, and rotate.

Features

• Intuitive color picker for selecting shadow color
• Responsive input sliders for adjusting parameters
• Real-time preview of shadow design
• One-click copy of CSS code snippets
• Instant feedback on copied code with a "Copied!" message
• Option to apply transformations to the shadow

Technologies Used

• React
• Material-UI

Getting Started

1. Clone the repository:

git clone https://github.com/chhavi48/css-box-shadow-generator.git

2. Navigate to the project directory:

cd css-box-shadow-generator

3. Install dependencies:

npm install

4. Start the development server:

npm start

5. Open your browser and navigate to http://localhost:3000 to view the application.

Contributing

Contributions are welcome! If you'd like to contribute to this project, please follow these steps:

1. Fork the repository.
2. Create a new branch (git checkout -b feature-branch).
3. Make your changes.
4. Commit your changes (git commit -am 'Add new feature').
5. Push to the branch (git push origin feature-branch).
6. Create a new Pull Request.

License

This project is licensed under the MIT License.

Acknowledgements

• Special thanks to Material-UI for providing the components used in this project.
• Thanks to all contributors who helped make this project better!