This is a fun little color picker that generates random color and allows a user to pick a color swatch from a bunch of randomly generated colors. Right now the total numbers generated is 100 but this is relatively easy to change by updating the totalNumberOfColors variable in src/component/App/index.js. Upon clicking on a color swatch the website generates two color swatches with lighter luminosity and two color swatches with darker luminosity. A user can hit the clear button to go back.
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
What things you need to install the software and how to install them
a computer, the internet, and much brawndo to stay hydrated
A step by step series of examples that tell you how to get a development env running
To install and run on your machine, git clone or download the repo and then run the following commands.
npm install
npm run start
Point your browser to localhost to preview. It will live reload as you make any updates to the React or CSS files.
Here's a gif preview of what the website actions looks like:
Per typical convention the HH logo in the navigation bar brings a user back to the home page.
Deployed via the amazing Netlify to here.
- ReactJS - The JS framework used
- TailwindCSS - Utility first CSS framework
- Webpack - Used to generate RSS Feeds
- randomColorJS - Used to generate RSS Feeds
Feel free to create a fork and then send a PR if you would like to contribute.
- David Lindahl - A One Man Coding Army - My Github
This project is licensed under the MIT License - see the LICENSE.md file for details
- Much thanks to friends and family who put up with me
- Create some tests
- Design layout for mobile first
- Add ability for user to change the total number of randomly generated colors
- perfect the color swatch details page so it more accurately grabs color variants of the selected color
- underline the current page in the pagination feature
- search functionality
- functionality for the colors on the sidebar
- perhaps find a color API to use for the color swatches and details page
MIT © David A. Lindahl