Skip to content

Add Color Picker App with Search Functionality and Color Variants#17

Open
drakeRAGE wants to merge 1 commit intosmthari:masterfrom
drakeRAGE:master
Open

Add Color Picker App with Search Functionality and Color Variants#17
drakeRAGE wants to merge 1 commit intosmthari:masterfrom
drakeRAGE:master

Conversation

@drakeRAGE
Copy link

Description:

This pull request adds a fully functional Color Picker app to the project. The app includes the following features:

  • Search Bar for Hex Codes: Users can input a color hex code into the search bar. The app will generate four different variants of the input color, ranging from light to dark.

  • Copy to Clipboard: Users can click on any of the generated color variants to copy the corresponding hex code to their clipboard for easy use elsewhere.

  • Color History: The app also features a color history section where the last 10 searched colors are stored and displayed. Users can click on these colors to copy their hex codes as well.

  • Responsive Design: The app is fully responsive, ensuring a seamless experience on mobile devices, tablets, and desktops.

  • Professional UI: The app features a clean and professional design with a gradient background, rounded corners, and smooth hover effects. The container background also includes a subtle gradient to enhance the overall aesthetics.

Screenshots:

Laptop size :
image

Tablet size:
image

Mobile size:
image

How to Test:

  • Clone the repository.

  • Navigate to the project directory.

  • Run npm install to install dependencies.

  • Run npm run dev to start the development server.

  • Open the app in your browser and test the features by entering different hex codes and interacting with the color variants.

Related Issue:

This pull request addresses and closes Issue #15.

Additional Notes:

The app is designed to be easily extendable for future enhancements, such as adding more color variants or integrating with color libraries.

Feedback and suggestions for further improvements are welcome!

Copy link

@codeCraft-Ritik codeCraft-Ritik left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice approach — the logic flows well and is readable.”

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants