Lewati ke konten
🛠️ToolsShed

Web Safe Fonts Reference

Jelajahi semua font web-safe dengan pratinjau langsung difilter menurut kategori serif, sans-serif, dan monospace.

18px
Arialsans-serif
Arial, Helvetica, sans-serif

The quick brown fox jumps over the lazy dog

Arial Blacksans-serif
'Arial Black', Gadget, sans-serif

The quick brown fox jumps over the lazy dog

Verdanasans-serif
Verdana, Geneva, sans-serif

The quick brown fox jumps over the lazy dog

Tahomasans-serif
Tahoma, Geneva, sans-serif

The quick brown fox jumps over the lazy dog

Trebuchet MSsans-serif
'Trebuchet MS', Helvetica, sans-serif

The quick brown fox jumps over the lazy dog

Impactsans-serif
Impact, Charcoal, sans-serif

The quick brown fox jumps over the lazy dog

Helveticasans-serif
Helvetica, Arial, sans-serif

The quick brown fox jumps over the lazy dog

Times New Romanserif
'Times New Roman', Times, serif

The quick brown fox jumps over the lazy dog

Georgiaserif
Georgia, serif

The quick brown fox jumps over the lazy dog

Garamondserif
Garamond, serif

The quick brown fox jumps over the lazy dog

Palatino Linotypeserif
'Palatino Linotype', 'Book Antiqua', Palatino, serif

The quick brown fox jumps over the lazy dog

Book Antiquaserif
'Book Antiqua', Palatino, serif

The quick brown fox jumps over the lazy dog

Courier Newmonospace
'Courier New', Courier, monospace

The quick brown fox jumps over the lazy dog

Lucida Consolemonospace
'Lucida Console', Monaco, monospace

The quick brown fox jumps over the lazy dog

Monacomonospace
Monaco, 'Courier New', monospace

The quick brown fox jumps over the lazy dog

Nama Font
Arial
Arial Black
Verdana
Tahoma
Trebuchet MS
Impact
Helvetica
Times New Roman
Georgia
Garamond
Palatino Linotype
Book Antiqua
Courier New
Lucida Console
Monaco

Tentang alat ini

Font yang aman untuk web adalah typeface yang dijamin akan ditampilkan dengan benar di semua perangkat dan browser tanpa memerlukan unduhan tambahan, membentuk fondasi tipografi web yang andal. Tidak seperti font kustom, yang dapat meningkatkan waktu muat halaman dan memerlukan strategi fallback, font yang aman untuk web sudah terinstal di praktis semua komputer dan sistem operasi. Alat ini menyediakan referensi komprehensif dari semua font yang aman untuk web yang diorganisir menurut kategori—serif, sans-serif, dan monospace—sehingga Anda dapat dengan cepat menemukan typeface sempurna untuk desain Anda tanpa harus menebak cara rendernya.

Menggunakan referensi ini sangat mudah: telusuri daftar lengkap font yang aman untuk web dengan pratinjau langsung yang menunjukkan dengan tepat bagaimana setiap typeface terlihat, atau filter menurut kategori untuk fokus pada font serif untuk desain tradisional, sans-serif untuk tata letak modern dan bersih, atau monospace untuk kode dan konten teknis. Setiap pratinjau menampilkan font dalam berbagai ukuran dan bobot sehingga Anda dapat mengevaluasi keterbacaan dan dampak visual sebelum berkomitmen pada desain Anda. Ketika Anda menemukan font yang Anda sukai, Anda dapat menyalin deklarasi CSS font-family-nya langsung ke lembar gaya Anda.

Alat ini sangat penting bagi pengembang dan desainer yang ingin membangun situs web yang cepat dan andal tanpa kerumitan layanan font web. Dengan memilih dari font yang aman untuk web, Anda memastikan tipografi yang konsisten di seluruh perangkat, mengurangi permintaan HTTP, dan meningkatkan kinerja halaman—sambil mempertahankan standar desain profesional.

Pertanyaan yang Sering Diajukan

Implementasi Kode

# Generate CSS font stacks for web-safe fonts
WEB_SAFE_FONTS = {
    "serif": [
        ("Georgia", "Georgia, 'Times New Roman', Times, serif"),
        ("Times New Roman", "'Times New Roman', Times, serif"),
        ("Palatino", "'Palatino Linotype', 'Book Antiqua', Palatino, serif"),
        ("Garamond", "Garamond, serif"),
    ],
    "sans-serif": [
        ("Arial", "Arial, Helvetica, sans-serif"),
        ("Helvetica", "Helvetica, Arial, sans-serif"),
        ("Verdana", "Verdana, Geneva, sans-serif"),
        ("Tahoma", "Tahoma, Geneva, sans-serif"),
        ("Trebuchet MS", "'Trebuchet MS', Helvetica, sans-serif"),
    ],
    "monospace": [
        ("Courier New", "'Courier New', Courier, monospace"),
        ("Lucida Console", "'Lucida Console', Monaco, monospace"),
        ("Consolas", "Consolas, 'Courier New', monospace"),
    ],
}

for category, fonts in WEB_SAFE_FONTS.items():
    print(f"\n{category.upper()}")
    for name, stack in fonts:
        print(f"  {name}: font-family: {stack}")

Comments & Feedback

Comments are powered by Giscus. Sign in with GitHub to leave a comment.