Stylepack

Fonts

The fonts how.studio uses

how.studio sets its headlines in Azeret Mono and its body text in wagram. Azeret Mono is a licensed font the site serves itself. The closest free match on Google Fonts: Inter.

Measured from how.studio 4 days ago.

Open the full design packDownload the pack

Font families

2 families
Azeret Mono
Used for
h1, label, button
Source
Self-hosted
Free alternative
Inter
wagram
Used for
h2, body
Source
Self-hosted
Free alternative
Inter

CSS to reproduce it

Font variables with the free stand-in in the stack, so the same CSS works with or without the licensed font.

:root {
  --font-heading: "Azeret Mono", "Inter", monospace; /* Inter stands in for Azeret Mono */
  --font-body: "Azeret Mono", "Inter", monospace; /* Inter stands in for Azeret Mono */
  --font-size-base: 16px;
}

How the type is set

headline-displayQuick brown foxAzeret Mono / 12px / 360 / lh 13.8px
headline-lgQuick brown foxwagram / 60px / 300 / lh 51px / -3px
headline-mdQuick brown foxwagram / 24px / 400 / lh 1.4
body-mdThe quick brown fox jumps over the lazy dogwagram / 16px / 400 / lh 24px
label-mdThe quick brown fox jumps over the lazy dogAzeret Mono / 12px / 360 / lh 1.15
buttonThe quick brown fox jumps over the lazy dogAzeret Mono / 12px / 360 / lh 13.8px
Font sizes in use
10121632406072

For AI agents

The pack is plain text, no key: fetch DESIGN.md, or hand the whole pack to Claude Code, Cursor or Copilot with the MCP server.

curl -s https://stylepack.ai/packs/how.studio/DESIGN.md

Questions

What font does how.studio use?

how.studio uses Azeret Mono, wagram. Headlines are set in Azeret Mono and body text in wagram, measured from the site as it renders, not read from its stylesheet.

Is the how.studio font free to use?

No. Azeret Mono is a licensed font that how.studio serves itself. The closest free match is Inter, available on Google Fonts. The CSS on this page puts it in the font stack as the stand-in.

How do I get the same typography as how.studio in my project?

Download the how.studio design pack from Stylepack: it holds the font stack, the type scale, every text style and the screenshots, in a form an AI coding agent such as Claude Code or Cursor can build from.