Stylepack

Czcionki

Czcionki, których używa headspace.com

headspace.com składa nagłówki i tekst w czcionce Headspace Apercu. Headspace Apercu to licencjonowana czcionka, którą strona serwuje sama. Najbliższy darmowy zamiennik z Google Fonts: Figtree.

Zmierzono na headspace.com 4 dni temu.

Otwórz pełny pakiet designuPobierz pakiet

Rodziny czcionek

Czcionki: 1
Headspace Apercu
Użycie
h2, h3, body, label, button
Źródło
Własny hosting
Darmowy zamiennik
Figtree

CSS do odtworzenia

Zmienne czcionek z darmowym zamiennikiem w stosie, więc ten sam CSS działa z licencjonowaną czcionką i bez niej.

:root {
  --font-heading: "Headspace Apercu", "Figtree", sans-serif; /* Figtree stands in for Headspace Apercu */
  --font-body: "Headspace Apercu", "Figtree", sans-serif; /* Figtree stands in for Headspace Apercu */
  --font-size-base: 20px;
}

Jak składany jest tekst

headline-displayQuick brown foxHeadspace Apercu / 52px / 700 / lh 57.2px / -1.56px
headline-lgQuick brown foxHeadspace Apercu / 64px / 700 / lh 64px / -1.92px
headline-mdQuick brown foxHeadspace Apercu / 40px / 700 / lh 46px / -1.2px
body-mdThe quick brown fox jumps over the lazy dogHeadspace Apercu / 20px / 400 / lh 30px / -0.2px
label-mdThe quick brown fox jumps over the lazy dogHeadspace Apercu / 14px / 500 / lh 18px / -0.14px
buttonThe quick brown fox jumps over the lazy dogHeadspace Apercu / 18px / 700 / lh 21.6px / -0.54px
Używane rozmiary czcionek
12141618202432406472

Dla agentów AI

Pakiet to zwykły tekst, bez klucza: pobierz DESIGN.md albo przekaż cały pakiet do Claude Code, Cursor lub Copilot przez serwer MCP.

curl -s https://stylepack.ai/packs/headspace.com/DESIGN.md

Pytania

Jakiej czcionki używa headspace.com?

headspace.com używa Headspace Apercu. Nagłówki są złożone w czcionce Headspace Apercu, a tekst w czcionce Headspace Apercu; zmierzono to na stronie tak, jak się renderuje, a nie odczytano z jej arkusza stylów.

Czy czcionka headspace.com jest darmowa?

Nie. Headspace Apercu to licencjonowana czcionka, którą headspace.com serwuje sam. Najbliższy darmowy zamiennik to Figtree, dostępny w Google Fonts. CSS na tej stronie wstawia go do stosu czcionek jako zastępstwo.

Jak uzyskać w projekcie taką samą typografię jak headspace.com?

Pobierz pakiet designu headspace.com ze Stylepack: zawiera stos czcionek, skalę typograficzną, każdy styl tekstu i zrzuty ekranu w formie, z której agent AI do kodowania, taki jak Claude Code czy Cursor, może budować.