Fonts — shieldcn

Pick a font with the ?font= query parameter. All fonts are rendered at weight 500 (medium) via Satori.

Available fonts

Slug	Font	Type	Best for
`inter`	Inter	Sans-serif	Default — matches shadcn/ui
`geist`	Geist	Sans-serif	Vercel projects
`geist-mono`	Geist Mono	Monospace	Version numbers, code
`jetbrains-mono`	JetBrains Mono	Monospace	Developer-focused badges
`fira-code`	Fira Code	Monospace	Code & terminal badges
`roboto`	Roboto	Sans-serif	Universal readability
`space-grotesk`	Space Grotesk	Sans-serif	Modern, geometric look

Usage

![inter](https://shieldcn.dev/npm/react.svg?font=inter)
![jetbrains](https://shieldcn.dev/npm/react.svg?font=jetbrains-mono)
![fira](https://shieldcn.dev/npm/react.svg?font=fira-code)
![roboto](https://shieldcn.dev/npm/react.svg?font=roboto)
![space](https://shieldcn.dev/npm/react.svg?font=space-grotesk)

Comparison

Sans-serif fonts

Inter — the default, matches shadcn/ui.

Geist — Vercel's typeface.

Roboto — Google's universal font.

Space Grotesk — geometric, modern.

Monospace fonts

Monospace fonts work especially well for version badges, build status, and anything code-related.

Geist Mono — Vercel's monospace.

JetBrains Mono — designed for code.

Fira Code — the original coding font.

Combining with variants

Fonts compose freely with all variants, themes, sizes, and modes:

JetBrains Mono + branded

Fira Code + outline

Space Grotesk + secondary

Roboto + blue theme

In the builder

The font selector is available in both the Badge Builder and Profile Generator under Global defaults. You can also set fonts per-badge via the badge's override popover.