Karla
埋め込みタグ(スタイルシート)
@import url('https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
埋め込みタグ(HTML/linkタグ)
<link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap" rel="stylesheet">
CSS
body { font-family: 'Karla', sans-serif; font-style: italic; /* italic */ font-weight: 200; /* Extra-light 200 */ font-weight: 300; /* Light 300 */ font-weight: 400; /* Regular 400 */ font-weight: 500; /* Medium 500 */ font-weight: 600; /* Semi-bold 600 */ font-weight: 700; /* Bold 700 */ font-weight: 800; /* Extra-bold 800 */ }
Extra-light 200
Almost before we knew it, we had left the ground. 0123456789
Extra-light 200 italic
Almost before we knew it, we had left the ground. 0123456789
Light 300
Almost before we knew it, we had left the ground. 0123456789
Light 300 italic
Almost before we knew it, we had left the ground. 0123456789
Regular 400
Almost before we knew it, we had left the ground. 0123456789
Regular 400 italic
Almost before we knew it, we had left the ground. 0123456789
Medium 500
Almost before we knew it, we had left the ground. 0123456789
Medium 500 italic
Almost before we knew it, we had left the ground. 0123456789
Semi-bold 600
Almost before we knew it, we had left the ground. 0123456789
Semi-bold 600 italic
Almost before we knew it, we had left the ground. 0123456789
Bold 700
Almost before we knew it, we had left the ground. 0123456789
Bold 700 italic
Almost before we knew it, we had left the ground. 0123456789
Extra-bold 800
Almost before we knew it, we had left the ground. 0123456789
Extra-bold 800 italic
Almost before we knew it, we had left the ground. 0123456789