Stylepack

Schriften

Die Schriften von how.studio

how.studio setzt Überschriften in Azeret Mono und Fließtext in wagram. Azeret Mono ist eine lizenzierte Schrift, die die Seite selbst ausliefert. Die nächste freie Alternative auf Google Fonts: Inter.

vor 4 Tagen auf how.studio gemessen.

Ganzes Designpaket öffnenPaket herunterladen

Schriftfamilien

2 Schriftfamilien
Azeret Mono
Verwendet für
h1, label, button
Quelle
Selbst gehostet
Freie Alternative
Inter
wagram
Verwendet für
h2, body
Quelle
Selbst gehostet
Freie Alternative
Inter

CSS zum Nachbauen

Schrift-Variablen mit der freien Alternative im Font-Stack, damit dasselbe CSS mit und ohne die lizenzierte Schrift funktioniert.

: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;
}

So ist der Text gesetzt

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
Verwendete Schriftgrößen
10121632406072

Für KI-Agenten

Das Paket ist reiner Text, ohne Key: hol dir DESIGN.md oder gib das ganze Paket per MCP-Server an Claude Code, Cursor oder Copilot.

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

Fragen

Welche Schrift benutzt how.studio?

how.studio nutzt Azeret Mono, wagram. Überschriften sind in Azeret Mono gesetzt, Fließtext in wagram, gemessen an der gerenderten Seite, nicht aus dem Stylesheet gelesen.

Ist die Schrift von how.studio frei nutzbar?

Nein. Azeret Mono ist eine lizenzierte Schrift, die how.studio selbst ausliefert. Die nächste freie Alternative ist Inter, verfügbar auf Google Fonts. Das CSS auf dieser Seite setzt sie als Ersatz in den Font-Stack.

Wie bekomme ich dieselbe Typografie wie how.studio in mein Projekt?

Lade das Designpaket von how.studio bei Stylepack herunter: Es enthält den Font-Stack, die Schriftskala, jeden Textstil und die Screenshots, in einer Form, aus der ein KI-Coding-Agent wie Claude Code oder Cursor bauen kann.