Bitter

Try Bitter

Weights and styles

• Thin 100Bitter Thin Thin Italic
• ExtraLight 200Bitter ExtraLight ExtraLight Italic
• Light 300Bitter Light Light Italic
• Regular 400Bitter Regular Italic
• Medium 500Bitter Medium Medium Italic
• SemiBold 600Bitter SemiBold SemiBold Italic
• Bold 700Bitter Bold Bold Italic
• ExtraBold 800Bitter ExtraBold ExtraBold Italic
• Black 900Bitter Black Black Italic

Bitter is a variable font: the download holds the whole weight range in one file per style, and the named weights above are positions on that range.

About Bitter

Bitter is a slab serif family that Sol Matas designed for reading on computers and other devices. The design began on a pixel grid, and it keeps a large lowercase height and little difference between thick and thin strokes. Its serifs match the stems in thickness and end square, and the Regular is drawn darker than a typical print Regular, so paragraphs have a dense, even colour. In the specimen the lightest weight is a fine, wire-like line with flat slabs, while Black is compact and heavy. Bitter is a variable font with one axis, weight, from 100 to 900; nine named weights and their italics make 18 styles. The fonts hold 1,522 glyphs and cover Latin, Latin Extended, Cyrillic and Vietnamese. The official notes say it was spaced by hand so that it needs few kerning pairs. The license is the SIL Open Font License 1.1.

Where Bitter works

Long articles on the web

The large lowercase height and low stroke contrast were chosen for screens, where thin hairlines tend to break up.

E-books and reading apps

Bitter was motivated by the growth of electronic books, and its dark Regular holds its colour on e-ink and LCD alike.

Blogs that use one family throughout

Weights from 100 to 900 let headings, text and captions come from the same variable files.

Russian, Ukrainian and Bulgarian text

The 1,522 glyphs include Cyrillic, so a slab serif look carries across Latin and Cyrillic editions.

Headlines and pull quotes

ExtraBold and Black turn the square slabs into a strong display voice.

Glyphs

Language support

The family contains the core letters these languages are written with:

• English
• French
• German
• Spanish
• Portuguese
• Italian
• Dutch
• Swedish
• Norwegian
• Danish
• Finnish
• Icelandic
• Catalan
• Turkish
• Polish
• Czech
• Slovak
• Hungarian
• Romanian
• Croatian
• Slovenian
• Lithuanian
• Latvian
• Estonian
• Vietnamese
• Russian
• Ukrainian
• Bulgarian

Writing systems with glyphs in the family besides Latin: Cyrillic. These are listed as scripts, not as a promise for every language written in them.

Character sets found in the files: cyrillic, cyrillic-ext, latin, latin-ext, vietnamese. The language list is a check of required letters against the font, not a promise of typographic quality in each language.

License

Fonts that pair with Bitter

Suggestions come from simple rules on the records: a contrasting classification and enough weights to carry body text. They are a starting point, not a verdict.

Use Bitter on the web

Download the family and host the files on your own site, then declare them in CSS. Please do not link to the files on trendhub.net: preview files here are subsets and their addresses change.

@font-face {
  font-family: "Bitter";
  src: url("/assets/fonts/Bitter-Italic-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Bitter";
  src: url("/assets/fonts/Bitter-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Bitter", serif;
}

Or load it from the official source. Google Fonts serves Bitter with this markup:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Bitter:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">

Things to know

Listed as a serif at the source

The official catalogue puts Bitter under serif; its square, stem-thick serifs make it a slab serif.

Regular is darker than usual

The official notes state that Regular is thicker than a typical print Regular, so text looks heavier than in many serif families.

Two variable files

Roman and italic each come as one variable file covering 100 to 900. Static files are not in the package.

FAQs

Collections with Bitter

• Fonts for presentations and slides

  Sans-serif and slab-serif families that stay readable on a projector or a shared screen, with strong bolds for slide titles.

• Serif fonts for long reading on screens

  Text serifs drawn for screens or for long reading: large x-heights, moderate contrast and real italics for articles, blogs and documentation.

• Slab serif fonts

  Slab-serif families with block-like serifs, from geometric and typewriter-flavored designs to sturdy text faces with italics.

• Font families with nine weights and italics

  Complete families running from Thin to Black with an italic for every weight: eighteen styles for a full typographic system.

Similar fonts

Other families in the same classification, ordered by shared use tags. All slab serif fonts