National Park
Type with Purpose
Good typography guides attention, improves understanding, and makes communication effortless.
The Anatomy of a Typeface
By FontSide · June 2026
Every typeface is a system of decisions — about stroke contrast, x-height, spacing, and rhythm. The best ones feel invisible: you stop seeing the letters and start hearing the voice behind them. That transparency is the hardest thing to design.
A high x-height opens up the counters and makes small text breathe. Tight tracking pulls a headline together; loose tracking gives a caption room to exhale. None of these choices are accidents — they are arguments about how reading should feel.
Uppercase
Lowercase
Numerals
Symbols
Package Manager
The recommended way to use fonts in modern web projects.
1. Install Package
pnpm add @fontsource-variable/national-park2. Import in App
import '@fontsource-variable/national-park/wght.css';3. CSS Usage
body {
font-family: "National Park Variable", sans-serif;
}Google Fonts CDN
Use Google's CDN to embed the fonts directly via HTML.
HTML <head>
<!-- Please select at least one weight and style -->Fontsource CDN
Skip the build step by adding this directly to your global CSS file.
Global CSS
/* national-park-latin-wght-normal */
@font-face {
font-family: "National Park Variable";
font-style: normal;
font-display: swap;
font-weight: 100 900;
src: url(https://cdn.jsdelivr.net/fontsource/fonts/national-park:vf@latest/latin-wght-normal.woff2)
format("woff2-variations");
}Background & Story
National Park is a variable font offering 7 weights (Extra Light, Light, Regular, Medium, SemiBold, Bold and Extra Bold).
To contribute, see github.com/benhoepner/National-Park.
The letterforms found on the wooden signage at the Rocky Mountain National Park inspired the creation of the National Park. The letters on these wooden trail and directional signs are a system of paths, points, and curves that a router follows. The router’s "bit" follows the path and gives the letters its stroke weight or thickness when engraving a sign. National Park Typeface walks along the path of both honoring the quirky nature of the forms being created by a router bit and optimizing the forms to work in a variety of sizes and languages for print, web, and mobile platforms.
The design of each character begins with a vector skeleton, represented by a series of coordinates that a router would typically interpret and carve into a wooden sign. From there adjustments were made to each skeleton to ensure comfortable legibility at different weights, and we also incorporate optical adjustments where the capabilities of an analog router falls short. The result is a typeface that stays true to its unique inspiration, maintaining its inviting warmth and distinctive character. It can be effectively utilized across a wide range of applications while preserving the essence that makes it truly special.
Tags & Moods
Subsets
Install
pnpm add @fontsource-variable/national-parkDesigned by
Andrea Herstowski, Ben Hoepner, Jeremy Shellhorn
Links
License
OFL-1.1