Pixel fonts are a strange case in modern type. They are drawn to look like the square dots of an old screen, but they are delivered as ordinary outline fonts, which a computer will happily scale to any size — including sizes that turn every crisp square into a soft blur. Using one well is mostly about respecting the grid it was drawn on.
The free pixel fonts worth knowing
Press Start 2P is the classic arcade face, built on an eight-by-eight grid from 1980s game screens, and the one most people mean by an 8-bit font. VT323 recreates the lettering of a DEC video terminal and is taller and narrower, which makes it better for passages of text. Silkscreen is tiny by design, made for labels at very small sizes. Pixelify Sans and Jersey 25 are newer drawings with more weights and a more contemporary feel.
All of them are gathered on the pixel style page.
Why they blur, and how to stop it
A pixel font is designed so each square in the letter lands on exactly one pixel of the screen, or exactly two, or four. At those sizes the edges fall on pixel boundaries and stay sharp. At a size in between, an edge lands halfway across a pixel and the system shades that pixel grey to approximate it. That grey fringe is the blur.
- Use exact multiples. For Press Start 2P that means 8, 16, 24 or 32 pixels. Other pixel fonts have their own base size; set a line of text at several sizes and the sharp ones are obvious.
- Avoid sizes in relative units for pixel text. A size in rem or em can come out as a fraction of a pixel after a user’s zoom or a parent’s scaling. Pixel values are the honest choice here.
- Do not add synthetic bold or italic. A browser that invents a bold smears the outline sideways by a fraction of a pixel. If a pixel font has no bold, it has no bold.
- In a game engine, render text at its native size and scale the whole canvas up by a whole number, with nearest-neighbour filtering. That keeps the squares square.
Where pixel type works, and where it does not
Game interfaces, retro-styled titles and pixel art are its home. For dialogue boxes, choose a face with a taller grid and a real lowercase, like VT323, because an arcade face in capitals becomes tiring past a sentence. For anything that has to be read at length by people who did not choose the aesthetic — terms and conditions, settings screens, help text — pair the pixel font with a clear sans and keep the pixels for the headings.
| Family | Variable download | Static download |
|---|---|---|
| Press Start 2P | None published | 41 KB1 file |
| VT323 | None published | 45 KB1 file |
| Silkscreen | None published | 24 KB2 files |
| Pixelify Sans | 32 KB1 file | 87 KB4 files |
| Jersey 25 | None published | 44 KB1 file |
Using them in a game you sell
Every font here may be bundled with a commercial game. The licence asks that the font file is not sold on its own and that its licence travels with it — in practice, a text file alongside the font in your game’s folder. Our licence explainer covers the details.
Pixel type on a web page
Browsers anti-alias text by default, which is exactly what a pixel font does not want. On macOS, -webkit-font-smoothing: none turns it off and the squares go hard-edged; other platforms vary, and the honest answer is that the size matters more than the smoothing. At an exact multiple of the grid the edges land on pixel boundaries and there is nothing for the anti-aliasing to soften.
- Set sizes in px, not rem: a user zoom or a parent scale can turn 1rem into 16.8px, which is where the blur comes from.
- Avoid transforms with fractional scales. If you scale a pixel-art interface, scale by 2, 3 or 4.
- Leave letter-spacing alone. The grid already includes the sidebearings, and a fractional em pushes every letter off it.
- Do not use synthetic bold or italic; both are computed transforms of the outline and both destroy the grid.
Inside a game engine
The same rule, expressed differently: render text at its native size and scale the whole frame by a whole number. In Unity that means a point filter on the font texture with mipmaps off; in Godot it means switching the texture filter to nearest on the font resource. Both engines default to a smooth filter, and both look wrong the moment a pixel font is used.
If the game has a resolution setting, tie the interface scale to it in integer steps rather than letting it interpolate. A game running at 1.5 times its native resolution will show half-pixel letters however careful the font choice was.
Where a pixel font stops being the right answer
A pixel face is a costume, and it costs legibility. Dialogue that runs to paragraphs, tutorial text, settings screens and anything legal are read rather than glanced at, and an eight-by-eight grid makes them slow work. The common solution is to keep the pixel face for titles, menus and scores, and set the long text in a clear sans at a comfortable size.
Some players need that anyway: a "readable font" option in the accessibility settings is now standard in games that use a stylised face, and it costs one extra family. Something plain and well-drawn such as Atkinson Hyperlegible — designed for low vision — is the obvious pairing, and it is free for commercial use like everything else here.
Pixel type on a phone
A phone screen reports CSS pixels while drawing two or three physical pixels for each one, which is good news: at a device pixel ratio of 2, a pixel font set at 16px draws each of its squares as a clean 2×2 block. The blur people see on mobile usually comes from somewhere else — a container scaled by a fraction, or a size in rem that landed on 16.8px after the user’s text-size setting.
So the rule is the same as everywhere: whole numbers. Set pixel type in px, scale containers by whole multiples, and test with the browser zoom at 110% as well as 100%, because that is where a fractional size appears without anybody choosing it.