Stylepack

Font

Font yang dipakai tailwindcss.com

tailwindcss.com memakai inter untuk judul dan teks isinya. inter adalah font berlisensi yang disajikan situs itu sendiri. Padanan gratis terdekat di Google Fonts: Inter.

Diukur dari tailwindcss.com 4 hari yang lalu.

Buka paket desain lengkapUnduh paket

Font family

2 font family
inter
Dipakai untuk
h1, h2, h3, body, button, code
Sumber
Dihosting sendiri
Alternatif gratis
Inter
plexMono
Dipakai untuk
label, code
Sumber
Dihosting sendiri
Alternatif gratis
Inter

CSS untuk menirunya

Variabel font dengan pengganti gratis di dalam stack, jadi CSS yang sama tetap bekerja dengan atau tanpa font berlisensinya.

:root {
  --font-heading: "inter", "Inter", monospace; /* Inter stands in for inter */
  --font-body: "inter", "Inter", monospace; /* Inter stands in for inter */
  --font-mono: "inter", "Inter", monospace; /* Inter stands in for inter */
  --font-size-base: 14px;
}

Cara teksnya ditata

headline-displayQuick brown foxinter / 96px / 400 / lh 96px / -4.8px
headline-lgQuick brown foxinter / 40px / 500 / lh 40px / -2px
headline-mdQuick brown foxinter / 36px / 600 / lh 48px
body-mdThe quick brown fox jumps over the lazy doginter / 14px / 400 / lh 28px
label-mdThe quick brown fox jumps over the lazy dogplexMono / 12px / 400 / lh 2
buttonThe quick brown fox jumps over the lazy doginter / 12px / 400 / lh 20px
codeconst pack = extract(url)plexMono / 13px / 400 / lh 24px
Ukuran font yang dipakai
1213141618364096

Untuk agen AI

Paket berupa teks biasa, tanpa kunci: ambil DESIGN.md, atau serahkan seluruh paket ke Claude Code, Cursor, atau Copilot lewat server MCP.

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

Pertanyaan

Font apa yang dipakai tailwindcss.com?

tailwindcss.com memakai inter, plexMono. Judul ditata dengan inter dan teks isi dengan inter, diukur dari situs saat dirender, bukan dibaca dari stylesheet-nya.

Apakah font tailwindcss.com gratis dipakai?

Tidak. inter adalah font berlisensi yang disajikan tailwindcss.com sendiri. Padanan gratis terdekatnya adalah Inter, tersedia di Google Fonts. CSS di halaman ini menaruhnya di font stack sebagai pengganti.

Bagaimana cara mendapatkan tipografi yang sama seperti tailwindcss.com di proyek saya?

Unduh paket desain tailwindcss.com dari Stylepack: isinya font stack, skala tipografi, setiap gaya teks, dan screenshot, dalam bentuk yang bisa dijadikan acuan AI coding agent seperti Claude Code atau Cursor.