CSS Utility Generators

Welcome to the CSS Utility Generators project! This repository contains multiple CSS utility generators designed to help developers quickly and easily create various CSS properties. So far, we have implemented a Box Shadow Generator and a Border Radius Generator.

Table of Contents

• Introduction
• Features
• Tutorials
• Getting Started
• Usage
• Contributing
• License

Introduction

CSS Utility Generators is a collection of tools designed to generate CSS code for common properties. These tools aim to simplify the process of creating CSS styles by providing an intuitive interface for generating code snippets.

Features

• Border Radius Generator: Generate border-radius values for creating rounded corners. Control each corner individually or uniformly.
• Box Shadow Generator: Create custom box shadows with ease. Adjust properties such as offset, blur, spread, and color.

Tutorials

Check out the video tutorial of the CSS Utility Generators https://www.youtube.com/watch?v=h-esmacCZrk&list=PLtUG3cTN2la0HqOZX4ZNLQPcJOaaoLfif

Getting Started

To get started with the project, follow these steps:

1. Clone the repository:

   git clone https://github.com/gkhan205/css-utility-generator
   cd css-utility-generators

2. Install dependencies:

   npm install

3. Run the development server:

   npm start

   The app will be available at http://localhost:3000.

Usage

Border Radius Generator

1. Navigate to the Border Radius Generator section.
2. Adjust the sliders or input fields for the top-left, top-right, bottom-left, and bottom-right radius values.
3. Copy the generated CSS code from the output area.

Box Shadow Generator

1. Navigate to the Box Shadow Generator section.
2. Adjust the sliders or input fields for properties such as offset-x, offset-y, blur radius, spread radius, and color.
3. Copy the generated CSS code from the output area.

Contributing

Contributions are welcome! If you have ideas for new features or improvements, feel free to open an issue or submit a pull request.

1. Fork the repository.

2. Create a new branch:

   git checkout -b feature/your-feature-name

3. Make your changes and commit them:

   git commit -m 'Add some feature'

4. Push to the branch:

   git push origin feature/your-feature-name

5. Open a pull request.

License

This project is licensed under the MIT License. See the LICENSE file for details.