Here at Mosaic Digital Media, we get time allotted for independent training each week to develop our skills relevant to our roles. This can be in the form of subject reading and research or in creating little projects that utilise specific technologies and skills that we would like to improve our knowledge of.
As well as building websites, my role also involves designing websites, as such, I work with a lot of colours and gradients. Therefore, I decided to build something that bridges the gap between design and development and create a tool that could automatically generate a random gradient at the touch of a button.
The end product was a tool that will generate a random gradient with two colours and a random angle of direction. To make it more user friendly, I also included a button that will copy the CSS code needed to replicate the gradient to the clipboard for use elsewhere.
Each time the button is pressed, it will generate two random colours via their hex value and choose a number between 0 and 360 (for the angle of direction).
It then uses a function to add the various pieces together in a string, in the same way, that CSS code will display a gradient – this then allows the gradient to be used within the project, such as where the gradient is displayed
Or take a closer look here: https://codepen.io/MDMJames/full/GRmqLer