Help center/Editor
Colors, typography and borders
Set your site's palette, fonts, and corner styles.
The Colors, Typography and Borders tools in the left rail set your site's look in one place. Changes apply across every page.
Colors#
Open Colors in the left rail.
- Under Palettes, click a palette to apply a full set of colors at once.
- Below the palettes, change any single color. Click the swatch next to a role and pick a new color.
The roles are grouped like this:
| Group | Roles |
|---|---|
| Page | Background |
| Text roles | Hero, Heading, Subheading, Title, Body, Accent, Caption, Tag |
| Header & footer | Header nav links, Footer links (each with a hover color), Footer text |
| Default button and Primary button | Background, Text and Border, each with a hover color |
| Cards | Background, Border |
| Scrollbar | Thumb |
Picking a palette clears the individual colors you changed. Choose the palette first, then fine-tune.
When you color a single element, such as a text block or icon, you can pick from Theme Colors or save your own under Custom Colors to reuse later.
Typography#
Open Typography in the left rail.
- Under Presets, click a preset to set your fonts together.
- To change one text role, click Edit next to it. Choose a font from the built-in library, then set its size and weight.
You can edit the text roles (Hero, Heading, Subheading, Title, Body, Accent text, Caption text, Small labels), Button, and the header and footer links and text. The font library can be searched and filtered by Sans, Serif, Mono and Display. Uploading your own font files isn't supported.
As with colors, picking a preset clears the role changes you made.
Borders#
Open Borders in the left rail. You can set:
| Item | Settings |
|---|---|
| Cards | Border width, Border radius |
| Default button | Border width, Border radius |
| Primary button | Border width, Border radius |
| Images | Border radius |
The image radius doesn't apply to logos. You can still override the radius on a single image or button from its own style settings.
Layout#
Open Layout in the left rail to choose how wide your pages are. Contained keeps your content in a centred column up to 1280 pixels wide. Full width spans the window up to 1920 pixels, with margins that grow on bigger screens, so very wide monitors don't stretch your content. Every section, the header and the footer follow it, backgrounds still fill the window, and you can change it at any time.
Long paragraphs keep a comfortable line length of about 70 characters, whichever width you choose.
Undo your changes#
Each panel shows Reset to defaults once you've changed something. It removes your changes in that panel and goes back to the current palette, preset or theme defaults. You can also use undo in the top bar.
Still need help? Email support@drome.site and we’ll get back to you.