Colours and type

Colours and typography are the two sections everything visual reads from. Change a colour here and the next thing you make uses it — and so does a presentation you made last month, the next time you open it.

A website page is the exception: it keeps the colours it was built with. See Changing your brand later.

Colours

The palette is not a mood board. Each colour has a job, and ANVL picks colours by their job rather than by their position in a list, which is why a deck stays readable when you swap one.

You do not pair the colours yourself. ANVL works out the combinations it will actually use — text on each background, a label on each surface — and shows the measured contrast for each one, against the usual accessibility levels of AA and AAA. The brand audit goes further and measures every colour in your palette against both a light and a dark ground, which you can switch between.

It is not there to grade you. It is there because a headline in your lightest brand colour looks fine on your screen and disappears on a projector, and you would rather find that out here than in a room.

Where a combination is too weak, ANVL says so and keeps working. You decide.

Typefaces

Typefaces are set per role — the one headings use, the one body text uses. Clearing the field opens a catalogue grouped by sans-serif, serif, display and mono — the selected ones; type to search all free typefaces. You can also type any family name, including one read off your own website.

Around eighty families are served from ANVL's own machines. Anything else is proxied, so nothing your reader opens ever calls Google directly. On screen, in the editor and on a published page, they are loaded when the page opens.

Your own font files

If your typeface is not free, upload its web files with Add web files in the typeface card: WOFF2 or WOFF, up to 8 MB per file. Weight and style are read from the file. TTF and OTF are desktop files and are refused — use the web files that come with the foundry's web licence.

Before the upload you tick We hold a licence that allows this typeface to be used on the web and in apps, and the card then shows who confirmed it and when. A file that calls itself something other than the typeface gets a warning, so a wrong file is caught early.

Until the files are in, the page says the typeface is missing, and you can choose a substitute — ANVL suggests the nearest free one, with the same width and shape, and lists More with the same shape. The substitute is used only until the web files are added, and nothing is saved until you choose it.

Getting a first version without typing

If your brand was built from a website address, the colours and typefaces were read off the site and you saw them presented as a finished kit — there is nothing to adjust on that screen. Everything is adjustable afterwards, here on the Brand page.

So a colour that came out wrong is not a mistake you have to live with; it is one edit. To read your website or your brand guidelines in again later, see Reading in your brand guidelines. Correcting a wrong guess is much faster than filling an empty field, which is the whole reason the reading happens first.