Changing colors
The colors your site uses for text, headings, backgrounds, buttons, etc are all controllable by way of the "Colors" section of your "Theme" page.
Color Palettes
There, you'll see some pre-made color palettes you can click to preview on your site. Clicking "Save" will apply the palette to your design, and cancel will revert your site's colors back to what they were before.
Color Pickers
You can refine your colors further using the individual color pickers, just under the palette selector.
These pickers allow you to choose from pre-made swatches, from a standardized color picker, or to manually enter a hex color code.
Transparencies
There are two ways to change the transparency of a color: You can either choose the totally transparent swatch from the swatch selector (it's the checkered pattern swatch):
Or, if you'd like a semi-transparent color, you can add a 2-digit hex opacity value to the end of any hex color, turning it into an 8-character code:
Here, the "33" at the end changes the color to 20% opacity. The codes aren't obvious, so here is a table of different values:
Opacity | 2-Digit Code | Example with White |
0% | 00 | #ffffff00 |
5% | 0d | #ffffff0d |
10% | 1a | #ffffff1a |
20% | 33 | #ffffff33 |
30% | 4d | #ffffff4d |
40% | 66 | #ffffff66 |
50% | 80 | #ffffff80 |
60% | 99 | #ffffff99 |
70% | b3 | #ffffffb3 |
80% | cc | #ffffffcc |
90% | e6 | #ffffffe6 |
95% | f2 | #fffffff2 |
100% | ff | #ffffffff |