Skip to content

A simple and modern Gradient Color Generator that lets you create, preview, and copy CSS gradients instantly.

Notifications You must be signed in to change notification settings

devhimelali/Gradient-Color-Generator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

๐ŸŽจ GradienCraft - Generate Custom Gradient Colors

A simple and responsive React app to generate random linear and radial gradients. You can choose the number of gradients, switch between gradient types, and regenerate fresh palettes with a click.

๐Ÿ“ธ Screenshots

img.png

โœจ Features

  • Generate random linear and radial gradients
  • Adjustable number of palettes
  • Random gradient angles for linear mode
  • Responsive layout (works on desktop, tablet, and mobile)
  • Copy gradient styles easily for use in your projects

๐Ÿš€ Tech Stack

  • React 19
  • Tailwind CSS for styling
  • Lucide React for icons
  • React Toastify for toast notifications
  • Vite for fast development

๐Ÿ“‚ Project Structure

โ”€โ”€ src/
    โ”œโ”€โ”€ components/
    โ”‚   โ”œโ”€โ”€ GradientGenerator.jsx
    โ”‚   โ””โ”€โ”€ GradientCard.jsx
    โ”œโ”€โ”€ utils/
    โ”‚   โ””โ”€โ”€ colorUtils.js 
    โ”œโ”€โ”€ App.jsx
    โ””โ”€โ”€ main.jsx

โšก Getting Started

  1. Clone the repo
git clone https://github.com/yourusername/gradient-generator.git
cd gradient-generator 
  1. Install dependencies
npm install 
  1. Run the development server
npm run dev

Open http://localhost:5173 in your browser.

๐Ÿ”ฎ Future Improvements

  • Add ability to copy gradient code with one click
  • Support for multiple color stops
  • Save favorite gradients to local storage

๐Ÿ“ License

This project is licensed under the MIT License. Feel free to use, modify, and share.

About

A simple and modern Gradient Color Generator that lets you create, preview, and copy CSS gradients instantly.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published