By Jack Qiao | 3 minute read

Generate font combinations with Google fonts

A new way to discover fonts

When designers make color palettes, a common technique is to rotate the color wheel. Eg. we can make a complementary palette then rotate hues to form new palettes.

The Brandmark font generator does this with fonts instead of colors.

The hues have been rotated, but the relative relationship between each color is maintained.

From a geometric perspective, changing hues is equivalent to rotating a vector in an HSV colorspace.

I've previously discussed finding font pairings with a vector space model, where each font corresponds to a vector in an embedding feature-space. This approach lets us discover interesting pairings out of a vacuum, but a lot of the time we already have some fonts in mind and just want more options to play with, similar to rotating a color wheel.

The font generator uses font vectors to find visual contrasts that are similar to the input fonts. All the generated fonts maintain the relationship between the input title, accent and body fonts. As you slide from 0 to 180, the generated font parings become increasingly dissimilar to the input.

For example: you can quickly scroll through many designs in which the main titles are didone-esque, the accent font is an oblique sans-serif, and the body is a light sans-serif.

If you don't have an idea where to start, hit "randomize" to generate fonts using one of our manually-curated templates.