Portfolio Skills

Random Color Palette Generator

Click on the button below to shuffle the colors, when you find a color that you like lock it in - don't worry you can always unlock it later!

Color is: #003049

Color is: #d62828

Color is: #f77f00

Color is: #fcbf49

Color is: #eae2b7

Color Palette Generator

What?

This web applications generates a series of random colors. The user can lock in colors that they like with a view to generating a color palette for them to use. The HEX code for each color is displayed so that it can be easily copied.

Why?

Choosing colors in webdesign can be challenging, this tool will allow people to view a variety of different colors side-by-side to select ones they like. With modification it can also be used to color characters in a game or applied to full website or email themes.

How?

The project was completed using HTML to setup and define the elements. CSS was then used to set the default colors the user sees on startup. The Javascript file has a function that using the Math.random() method generates a random HEX code which is then applied by means of another function to update the text and background color. Finally the logic is setup so if the button is in "locked" state no more HEX codes will be generated for it.