ColorPalette Pro is a web application designed to help users generate and manage color palettes for their design projects. It provides an intuitive interface for selecting, viewing, and copying color values.
- Color Picker: Easily pick colors and add them to your palette.
- Palette Management: Add, view, and delete colors from your palette.
- Copy Color Values: Click on a color to copy its HEX value to the clipboard.
- Dark Mode: Toggle between light and dark mode for better accessibility and usability.
- Responsive Design: Optimized for both desktop and mobile devices.
Check out the live demo of ColorPalette Pro here.
To run this project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/theSamyak/ColorPalette-Pro.git
-
Navigate to the project directory:
cd ColorPalettePro
-
Install dependencies:
npm install
-
Start the development server:
npm start
The application should now be running on http://localhost:3000
.
-
Picking Colors:
- Use the text input to type a HEX color code or the color picker to select a color.
- Click the "Submit" button to generate different shades and tints of the selected color.
-
Managing Palette:
- View the generated colors displayed in a grid format.
- Click on any color to copy its HEX value to the clipboard.
- The application automatically updates the color palette as you type or pick a new color.
-
Toggling Dark Mode:
- Click the "Dark Mode" button to toggle between light and dark mode.
- React: JavaScript library for building user interfaces.
- CSS3: Styling of the application.
- Poppins Font: A clean and modern font for better readability and aesthetics.
- Values.js: A utility library for generating shades and tints of colors.
Contributions are welcome! To contribute, follow these steps:
- Fork the repository.
- Create a new branch:
git checkout -b feature-branch
. - Make your changes and commit them:
git commit -m 'Add new feature'
. - Push to the branch:
git push origin feature-branch
. - Open a pull request.
Please ensure your code adheres to the project's coding standards and includes relevant tests.