Load Inter via Fontsource and set mono stack

Self-host the Inter variable font through @fontsource-variable/inter
rather than a CDN, so the v2 type scale renders in Inter with no
third-party request. Import it from the theme and point --font-sans
at the "Inter Variable" family the package registers.

Add --font-mono as a Radix-style system stack: the design specifies
Menlo, an Apple system font that cannot be self-hosted, so it falls
back per OS (Consolas, Liberation Mono, Monaco, monospace).

Signed-off-by: Émile Ré <emile@probo.com>
This commit is contained in:
Émile Ré
2026-06-17 16:53:58 +02:00
parent 87d6d9d0d6
commit d7d6ddda2b
3 changed files with 19 additions and 1 deletions

View File

@@ -53,6 +53,9 @@
* These define --sand-1 … --sand-12, --gold-1 … etc. as raw CSS variables.
* P3 wide-gamut overrides are included via @supports in each file.
* ------------------------------------------------------------------------- */
/* Inter — self-hosted variable font (family name: "Inter Variable") */
@import "@fontsource-variable/inter/index.css";
@import "@radix-ui/colors/sand.css";
@import "@radix-ui/colors/sand-dark.css";
@import "@radix-ui/colors/gold.css";
@@ -209,7 +212,11 @@
* build is the Radix one, the same way --color-* is wiped above.
* ------------------------------------------------------------------------- */
@theme {
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-sans: "Inter Variable", ui-sans-serif, system-ui, sans-serif;
/* Code/mono — Radix-style system stack. The design specifies Menlo, an
* Apple system font that is not self-hostable, so fall back per OS. */
--font-mono: "Menlo", "Consolas", "Liberation Mono", "Monaco", monospace;
--text-*: initial;