Help

How to use CCBG?

Basics

Go to the Generator and click the big button to generate new random backgrounds. Then click on the code button and copy the generated CSS code into your project and and set the class colorful to the element you want to have the background. Check this example on CodePen.

Simple modifications

Edit the layers by clicking on the edit button . To change the color of one layer, click on it to open a color picker and set your desired color. You are also able to add or delete layers.

Advanced layer manipulation

Edit the layers by clicking on the edit button . Activate the Advanced mode by clicking on the toggle in the header. This mode let you alter the color, rotation and the positions of the color and the transparency for each layer.