Colors are amazing, but if you don't know what colors to use or need a great palette, Puppertino has you covered. We have taken these beautiful colors from Elementary guidelines. You can use the color palette component using the CSS of color palette or downloading the full CSS (Not recommended if you are just going to use this component).
Currently Puppertino consists of
12 color palettes which you can choose from. To use
them just click on them and the class for the color will be copied to
your clipboard! Alternatively, find the color you want to use, add
p-, the color and, the shade you want to
use, i.e: p-strawberry-100 (Base colors
don't use shade).
There are also text colors, just add -color at the end, i.e p-strawberry-100-color
New!
We've added colors as variables, so you use them wherever and however you like, just add -- before the color in your CSS code, i.e --p-strawberry-100. This can be use to create amazing gradients and theming.
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
900
700
500
300
100
Color copied!