Bloxwap Pixel

Version

1.000

Glyphs

2,435

Characters

2,299

Axes

wght 100–900 · ROND 0–100

Styles

9 + italics

Features

9

Languages

595

Download

6.9 MB

Two axesCopy Anchor Link

Every glyph is drawn on a pixel grid, and each pixel is a shape the axes control:

• Weight (wght, 100–900) fattens every pixel, from hairline dots to pixels that merge into solid strokes.
• Roundness (ROND, 0–100) morphs every pixel from a crisp square at 0 to a round dot at 100.

Named instances (each also as italic): Thin wght 100, ROND 50, ExtraLight wght 200, ROND 50, Light wght 300, ROND 50, Regular wght 400, ROND 50, Medium wght 500, ROND 50, SemiBold wght 600, ROND 50, Bold wght 700, ROND 50, ExtraBold wght 800, ROND 50, Black wght 900, ROND 50.

CSSCopy Anchor Link

Set weight with font-weight and roundness with font-variation-settings:

.scoreboard {
  font-family: "Bloxwap Pixel", "Bloxwap Mono", monospace;
  font-weight: 700;
  font-variation-settings: "ROND" 60;
}

Every Pixel glyph sits on the same 600-unit cell at every weight and roundness, so both axes animate without moving neighboring text:

.ticker-cell {
  font-family: "Bloxwap Pixel", monospace;
  font-weight: 400;
  font-variation-settings: "ROND" 0;
  transition: font-weight 300ms ease, font-variation-settings 300ms ease;
}
.ticker-cell.is-up {
  font-weight: 800;
  font-variation-settings: "ROND" 100;
}
@media (prefers-reduced-motion: reduce) {
  .ticker-cell { transition: none; }
}

Where to use itCopy Anchor Link

Pixel is a display face. Use it at 20 px and above for scoreboards, price tickers, countdowns, achievements, loading screens and other game-like moments, and pair it with Bloxwap Sans or Mono for body text.

It covers Latin, Greek and Cyrillic, box drawing and block elements, and has true italics. See its full list on Language support.