Project styles: colours and fonts

One set of colours and fonts for the whole app, edited in one place.

Where: More → Project styles.

The Colours tab starts with “Colours in your app”: every colour your screens are actually painted with, and how many places use it. Click a colour and pick another — it changes everywhere at once, even if it was typed into each element by hand or came with a template. Each place keeps its transparency, and a single Undo brings it all back.

Colours are named slots, each labelled with what it paints: accent (buttons and selected chips), secondary (links), app background (the very bottom), panel (cards, panels, inputs), text, muted text, borders and separators, destructive. When you colour an element you pick a slot — change it here and the whole app repaints at once.

Not enough slots? Add a custom colour and name it yourself: “second background”, “sale colour”. It shows up in the colour picker alongside the rest. Renaming repaints nothing; on delete the editor tells you how many places used it.

Typography covers size, weight and line height for large title, title, subtitle, body, caption and footnote. The font is set separately for body and for headings; 99 families with real Cyrillic are on offer, grouped as sans-serif, serif, display, handwriting and monospace. The list is searchable: type “Unbounded” or “handwriting”.

A brand typeface that is not in the list lives under the last item, “Custom font”. There you will find “Upload a font file”: .woff2, .woff, .ttf and .otf up to 4 MB. The file travels with the app, so the reader does not have to install anything. The family name comes from the file name and is edited in the field next to it, with a cross that takes the font out of the list. Upload one weight — bold and italic are synthesised by the browser.