The short version
- Bold fonts are typefaces drawn in heavy weights, usually 700 to 900, which stay readable at a distance and at small preview sizes.
- Anton, Archivo Black, Bebas Neue, Unbounded and Alfa Slab One are free bold fonts on Google Fonts.
- Condensed bold fonts fit more letters across a narrow space, while wide bold fonts make short words feel monumental.
- Bold type needs a little extra letter spacing at small sizes and tighter spacing at very large sizes.
- A true bold or black weight drawn by the type designer always looks better than a bold faked by software.
On this page
Bold fonts are typefaces with thick strokes, usually in weights from 700 (bold) to 900 (black), and they are the right choice whenever type has to be read fast: posters seen in passing, YouTube thumbnails a few centimetres wide, sale headlines in a busy feed. Good free options on Google Fonts include Anton and Bebas Neue for condensed impact, Archivo Black and Rubik Black for heavy grotesques, Unbounded for wide display, and Alfa Slab One for a chunky slab. Choose by format first, because a face that works on a poster can clog up on a thumbnail.
What the weight numbers mean
Font weights run on a numeric scale from 100 to 900. Most families label them with names, and CSS uses the numbers directly. Bold is technically 700, but for posters and thumbnails you often want 800 or 900.
Where it works
Where it works
Where it works
Where it works
Where it works
Where it works
Free bold fonts by job
Google Fonts
Why
Google Fonts
Why
Google Fonts
Why
Google Fonts
Why
Google Fonts
Why
Google Fonts
Why
Two notes. Bebas Neue has capitals only, so it is for short lines, not sentences. Unbounded is a variable font that runs from light to black, so you can pick the exact heaviness you want, and its wide letters make two or three words fill a whole poster.
Bold fonts for posters
A poster is read from across a room or a street in a few seconds. The headline should be readable at the distance people pass it, which usually means it fills a large share of the width. An A3 poster at 300 dpi is 3508×4961 pixels; a headline of three or four words in a black weight can comfortably take up a third of the height. Poster design covers layout and hierarchy.
An A3 gig poster. Set the headline in a heavy condensed face, sized to be read from the other side of the street.
A 1280×720 YouTube thumbnail: four or five bold words, left aligned, leaving space on the right for a face or object.
Bold fonts for YouTube thumbnails
Thumbnails are designed at 1280×720 but often seen at a fraction of that, in a sidebar or on a phone. That is the harshest test there is for type. Use a black weight, keep to three to five words, and prefer condensed faces when the words are long. Leave the bottom right corner clear, because YouTube places the video length there. Thumbnail text and YouTube thumbnail design go deeper.
How to make bold type read
Heavy letters have small counters, the enclosed spaces in a, e and o. Shrink them and those spaces fill in, so a bold word becomes a dark lump. The fixes are about spacing and contrast more than size.
Avoid
- Black weight at tiny sizes with zero letter spacing
- Fake bold made by a software button
- Bold type on a busy, equally loud background
- Every word on the poster in black weight
- Heavy letters crowded to the edges
Do
- Open spacing slightly when bold type is small
- A real 800 or 900 weight from the family
- A calm, contrasting area behind the headline
- Bold for the headline, regular for details
- Generous margins around heavy letters
Lettering effects can add even more presence. An outline, an inline or a gentle extrude gives a bold word depth without a drop shadow; outline text shows how. In Gradiently, the Lettering treatments Contour, Inline, Extrude and Double are built into the text tools, and the Mark behind the words relaxes its busiest detail and deepens or lifts the colour near the letters, so heavy type stays crisp on a vivid background.
Bold fonts in CSS
If you ask a browser for a weight the font file does not include, it may fake one by thickening the outlines, which looks smudged and uneven. Load the real weight, and switch off synthetic bold so you notice when it is missing.
@import url("https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;600&display=swap");
h1 {
font-family: "Archivo Black", "Arial Black", sans-serif;
font-weight: 400; /* Archivo Black has one weight, already heavy */
font-synthesis: none; /* never fake bold or italic */
line-height: 1;
letter-spacing: -0.01em;
}
.label {
font-family: "Inter", system-ui, sans-serif;
font-weight: 600;
letter-spacing: 0.02em; /* small bold text needs a little air */
}For more on choosing a voice for big type, read headline fonts and display fonts.
Questions people ask
What is the boldest free font?
There is no official ranking, but Archivo Black, Dela Gothic One, Bowlby One and Unbounded at its black weight are among the heaviest free fonts on Google Fonts.
What font weight is bold?
Bold is weight 700. Extra bold is 800 and black or heavy is 900.
What is the best bold font for YouTube thumbnails?
Condensed heavy faces such as Anton or Bebas Neue fit long words, while Archivo Black or Rubik Black suit short ones. Keep to three to five words.
Why does my bold text look blurry when small?
Heavy letters have small inner spaces that fill in at small sizes. Add a little letter spacing, use a slightly lighter weight or make the text bigger.
What is faux bold?
A bold made by software thickening a regular weight. It looks smeared and uneven. Use a real bold weight from the font family instead.
Written by Gradiently
The team behind Gradiently, a design tool built around Marks: living gradients that make everything you design look like yours.
See our profile