เริ่มต้นใช้งาน

ใช้ jsDelivr เพื่อใช้งานฟอนต์ผ่าน CDN

ดูข้อมูลฟอนต์ ตัวอย่าง และโค้ดพร้อมใช้ได้จากรายชื่อฟอนต์ในเมนูด้านซ้าย

URL สำหรับไฟล์ฟอนต์

https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@6/fonts/ชื่อฟอนต์/ชื่อไฟล์.woff2

ดูรายชื่อไฟล์ที่ใช้งานได้ของแต่ละฟอนต์ได้ในหน้าข้อมูลฟอนต์ หรือดูรายชื่อไฟล์พร้อมลิงก์ CDN ได้ที่นี่

ตัวอย่างการใช้งาน:

@font-face {
  font-family: 'Noto Sans Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@6/fonts/NotoSansThai/NotoSansThai-Regular.woff2') format('woff2');
  font-style: normal;
  font-weight: normal;
  font-display: swap;
}

ไฟล์ CSS รองรับในเวอร์ชัน 6.0.0 ขึ้นไป

ในหน้าข้อมูลฟอนต์จะมีไฟล์ CSS พร้อมใช้อยู่ โดย CSS นี้จะรองรับเฉพาะฟอนต์ทุกน้ำหนัก เฉพาะตัวปกติ ไม่รวมตัวเอียง ซึ่งครอบคลุมการใช้งานส่วนใหญ่ สามารถฝังไฟล์ CSS (<link>) หรือคัดลอก CSS (@font-face, @import) ไปใช้งานได้เลย

หากต้องการใช้งานน้ำหนักหรือรูปแบบอื่นๆ สามารถปรับแต่ง CSS ได้ด้วยตัวเอง โดยในแต่หน้าข้อมูลฟอนต์จะมีรายชื่อไฟล์ที่ใช้งานได้ทั้งหมดอยู่ครับ

URL สำหรับไฟล์ CSS

https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@6/fonts/ชื่อฟอนต์/ชื่อฟอนต์.css

ตัวอย่างการใช้งาน

<link href="https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@6/fonts/NotoSansThai/NotoSansThai.css" rel="stylesheet" />

jsDelivr สามารถย่อไฟล์ CSS ให้อัตโนมัติ โดยเติม .min ใน URL ไฟล์ CSS

ตัวอย่างไฟล์ CSS ปกติ:
https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@6/fonts/NotoSansThai/NotoSansThai.css

ตัวอย่างไฟล์ CSS หลังย่อ:
https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@6/fonts/NotoSansThai/NotoSansThai.min.css