CARA MENGGUNAKAN GOOGLE FONT DI CSS

Google Font adalah koleksi gratis dari lebih dari 800 jenis font yang disediakan oleh Google yang dapat digunakan oleh web developer dan desainer. Keuntungan menggunakan Google Font adalah font ini dapat diakses dimana saja dan kapan saja, asalkan ada koneksi internet. Jika kamu sedang mencari cara untuk mempercantik website kamu dengan berbagai pilihan font unik, maka Google Font adalah solusi yang kamu butuhkan. Berikut ini adalah cara menggunakan Google Font di CSS.

Langkah 1: Memilih Font

Pertama-tama, kamu perlu memilih font yang akan digunakan. Untuk memilih font, pergi ke website Google Font (https://fonts.google.com/). Kamu dapat memilih dari berbagai jenis font dan gaya.

Cara Memilih Font

1. Buka website Google Font.
2. Cari font yang kamu suka.
3. Klik pada font yang dipilih.
4. Klik “Select this font”.

Langkah 2: Mendapatkan Link CSS

Setelah memilih font, kamu akan mendapatkan link CSS yang perlu dipasang di file HTML kamu.

Mendapatkan Link CSS

1. Setelah memilih font, di bagian kanan bawah, kamu akan melihat pop-up berisi jumlah font yang telah kamu pilih. Klik pop-up ini.
2. Kamu akan melihat detil font yang dipilih. Di bagian bawah detil font, kamu akan melihat dua tab: “Embed” dan “Customize”.
3. Pada tab “Embed”, copy link yang ada di bagian “Standard”.

Langkah 3: Memasukkan Link CSS ke HTML

Link CSS yang kamu dapatkan dari Google Font perlu dipasang di file HTML kamu.

Cara Memasukkan Link CSS

1. Buka file HTML kamu.
2. Paste link CSS yang kamu copy sebelumnya ke dalam tag “head” di file HTML kamu.

Langkah 4: Menggunakan Font di CSS

Setelah memasukkan link CSS ke HTML, sekarang kamu bisa menggunakan font tersebut di CSS.

Cara Menggunakan Font di CSS

1. Buka file CSS kamu.
2. Untuk menggunakan font, kamu bisa menambahkannya ke dalam property “font-family” dalam kode CSS kamu. Sebagai contoh, jika kamu memilih font “Roboto”, maka kamu bisa menulisnya seperti berikut:

body {
    font-family: 'Roboto', sans-serif;
}

Itulah empat langkah mudah untuk menggunakan Google Font di CSS. Dengan berbagai pilihan font yang disediakan, kamu sekarang dapat menambahkan sentuhan pribadi ke dalam desain website kamu.