Dari ejekan bodoh dari desain tipe "Swiss" yang berlebihan hingga pekerja keras semi-serius, Grotesk yang terlalu sering digunakan mengubah dirinya menjadi peniru dengan meniru fitur yang paling membedakan dari Helvetica yang ada di mana-mana. Namun, jenis huruf tidak berhenti murni menjadi peniru; Ia ingin menjadi multiguna dan multibahasa, meskipun unik dan tidak banyak.
Jenis huruf ini awalnya berfungsi sebagai bentuk "pameran" untuk pengguna fontforge yang tidak sadar. Sayangnya karena perkembangan yang luar biasa cepat, bersama dengan alur kerja yang buruk dan manajemen yang buruk, proyek ini dengan cepat menjadi tidak dapat dipahami oleh pemula absolut. Sooo Oopsies
Font itu gratis & open-source, dan kontribusi apa pun akan sangat dihargai. Jika Anda berencana untuk menunjukkan jenis huruf ini kepada seseorang atau mengirimkannya ke koleksi font, harap ingat untuk menautkan repositori ini . Ini tidak wajib, tetapi menghemat banyak sakit kepala (percayalah).


| Nama gaya | wght | wdth | slnt | - | Nama gaya | wght | wdth | slnt |
|---|---|---|---|---|---|---|---|---|
| Lampu | 300 | 100 | 0 | - | Cahaya miring | 300 | 100 | -10 |
| Buku | 350 | 100 | 0 | - | Pesan miring | 350 | 100 | -10 |
| Roma | 400 | 100 | 0 | - | Miring | 400 | 100 | -10 |
| Sedang | 500 | 100 | 0 | - | Miring sedang | 500 | 100 | -10 |
| Semibold | 600 | 100 | 0 | - | Italic semibold | 600 | 100 | -10 |
| Berani | 700 | 100 | 0 | - | Miring tebal | 700 | 100 | -10 |
| Ekstrabold | 800 | 100 | 0 | - | Miring ekstrabold | 800 | 100 | -10 |
| Hitam | 900 | 100 | 0 | - | Miring hitam | 900 | 100 | -10 |
Setelah v1.0 - sebelum v2.0
Baik sumber dan folder rilis menyertakan font variabel .woff2, yang dapat Anda sertakan di situs web Anda dan merujuk menggunakan CSS dengan memasukkan sesuatu di sepanjang baris:
base.css
: root {
--font-sans : "Overused Grotesk" , -apple-system , BlinkMacSystemFont , "Segoe UI" , "Roboto" , "Oxygen" , "Ubuntu" , "Cantarell" , "Fira Sans" , "Droid Sans" , "Helvetica Neue" , sans-serif;
--font-serif : Georgia , Times , serif;
--font-mono : Menlo , Courier , monospace;
}
@font-face {
font-family : "Overused Grotesk" ;
src :
url ( "../fonts/OverusedGrotesk-VF.woff2" ) format ( "woff2 supports variations" ) ,
url ( "../fonts/OverusedGrotesk-VF.woff2" ) format ( "woff2-variations" );
font-weight : 300 900 ;
}Untuk mengurangi pergeseran tata letak kumulatif, Anda dapat preload font dan menggunakan Font Face Observer untuk menampilkan font dengan cepat.
base.html
<!DOCTYPE html >
< html lang =" en " >
< head >
< title > Static HTML is King ? </ title >
< meta charset =" UTF-8 " >
< meta name =" viewport " content =" width=device-width " >
< link rel =" stylesheet " href =" /css/base.css " >
< link rel =" preload " href =" /fonts/OverusedGrotesk-VF.woff2 " as =" font " type =" font/woff2 " crossorigin >
</ head >
< body >
< main >
< h1 > Static HTML is King ? </ h1 >
</ main >
<!--
https://fontfaceobserver.com/
To load a font, call the load method on a FontFaceObserver instance.
It’ll return a promise that resolves when the font loads, or rejected when the font fails to load.
-->
< script src =" /js/fontfaceobserver.js " > </ script >
< script >
var font = new FontFaceObserver ( 'Overused Grotesk' ) ;
font . load ( ) . then ( function ( ) {
console . log ( 'Overused Grotesk has loaded.' ) ;
} ) . catch ( function ( ) {
console . log ( 'Overused Grotesk failed to load.' ) ;
} ) ;
</ script >
</ body >
</ html > Proyek ini berada di bawah Lisensi Font Terbuka SIL 1.1. Jika perlu, simpan atau cetak dokumen ini untuk referensi di masa mendatang.
Anda dapat berkontribusi pada proyek ini dengan membuka masalah, membuat permintaan tarik, atau dengan secara langsung mengedit sumber.
Untuk informasi lebih lanjut, lihat Contributing.md.