You have had your colors in mind for ages: the sage green of the napkins, the warm terracotta of the stationery. Those are exactly the ones you can bring over to your page. All the color settings live in the editor under “Stil & Schriften” → “Farben” (Style & fonts → Colors) and take effect in the preview right away.
The color palette: five base colors
In the “Farbpalette” (Color palette) area you see five color circles. In this order they are Hauptfarbe (main color), Sekundär (secondary), Akzent (accent), Hintergrund (background) and Text. Hover over one with your mouse and its name appears. These five colors shape the overall impression of your page and serve as your supply at the same time: they show up again as a suggestion in every other color field in the editor.
Expand the “Farben” (Colors) group.
Click on one of the five circles. Your computer's color picker opens, and it looks different on a Mac than it does on Windows.
Pick your color. Sometimes it is only applied once you close the color picker.
Check the result in the preview and click “Speichern” (Save) at the top right.
Adding your own colors to the palette
To the right of the five circles sits a dashed plus circle with the note “Farbe zur Palette hinzufügen” (Add color to palette). With it you create as many shades of your own as you like, for example the rosé from your bridal bouquet. Every color you create is then available in all the color fields, including the colors of individual sections.
Changing one: click the circle and the color picker opens again.
Removing one: hover over the circle with your mouse and a small cross appears.
There is no limit to the number. A color that already exists is not added a second time.
Text and button colors
Below that are the “Text” and “Buttons” areas with four fields:
“Überschriften” (Headings) for all the headings on your page
“Fließtext” (Body text) for your texts, ideally a touch lighter than the headings
“Button-Farbe” (Button color) for the surface of your buttons
“Button-Textfarbe” (Button text color) for the label on top of it
Here you only pick from the existing circles, so from your palette and your own colors. The circle currently selected carries an inner ring. If you need a completely new shade, create it in the palette first using the plus circle. If you leave the button text color untouched, the page automatically decides between black and white, depending on how light your button color is.
Good to know: On your published page the main color and the text color of your palette have the final say. So if you choose a button or heading color that is quite different from the matching palette colors, your live page can look a little different from the preview in the editor. The simplest way: set the main color of the palette to the color your buttons should have, then the two match up.
Frequently asked questions
Where do I enter a HEX code?
There is no input field for that in the editor itself. Your operating system's color picker does have one, though: on a Mac you will find it in the tab with the sliders, on Windows under “More options”. You enter your code there and the color lands in the palette.
Why is my template suddenly set to “Benutzerdefiniert” (Custom)?
Because you have set a color of your own. That is intended and simply means: this design is yours now.
My buttons are hard to read.
Then the button color and the button text color are too close to each other. Take a clearly lighter or darker shade for the text and check the result on the sign-up section in the preview.
Can I give a single section a different color?
Yes. How that works is described in the article “Einzelne Abschnitte farblich absetzen” (Making individual sections stand out with color).