Noto Serif Thai

โดย Google

ดาวน์โหลดฟอนต์นี้

ดูบน jsDelivr

ดูบน GitHub

ฟอนต์นี้รองรับ Variable Fonts

หากต้องการใช้งานฟอนต์แบบปกติ เลือกชนิดฟอนต์ด้านล่างเป็น Static

ทดลองฟอนต์

ขนาด (26px)

น้ำหนัก (400)

ความกว้าง (100%)

กรุงเทพฯ ดุจเทพสร้าง เมืองศูนย์กลางการปกครอง วัดวังงามเรืองรอง เมืองหลวงของประเทศไทย

การใช้งาน

โค้ดพร้อมใช้งาน สำหรับฟอนต์รูปแบบปกติ ทุกน้ำหนัก สามารถคัดลอกไปใช้งานได้ทันที เบราว์เซอร์จะโหลดเฉพาะไฟล์ที่ต้องใช้เท่านั้น

เลือกชนิดฟอนต์:

ตัวเลือกที่ 1: ปรับได้เฉพาะน้ำหนัก (weight)

<link href="https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/var/NotoSerifThai[wght].css" rel="stylesheet" />

ตัวเลือกที่ 2: ปรับได้ทั้งน้ำหนัก (weight) และความกว้าง (width)

<link href="https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/var/NotoSerifThai[wdth,wght].css" rel="stylesheet" />

ตัวเลือกที่ 1: ปรับได้เฉพาะน้ำหนัก (weight)

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/var/NotoSerifThai[wght].woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

ตัวเลือกที่ 2: ปรับได้ทั้งน้ำหนัก (weight) และความกว้าง (width)

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/var/NotoSerifThai[wdth,wght].woff2') format('woff2');
  font-style: normal;
  font-stretch: 62.5% 100%;
  font-weight: 100 900;
  font-display: swap;
}

ตัวเลือกที่ 1: ปรับได้เฉพาะน้ำหนัก (weight)

@import 'https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/var/NotoSerifThai[wght].css';

ตัวเลือกที่ 2: ปรับได้ทั้งน้ำหนัก (weight) และความกว้าง (width)

@import 'https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/var/NotoSerifThai[wdth,wght].css';

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

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-Thin.woff2') format('woff2');
  font-style: normal;
  font-weight: 100;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-ExtraLight.woff2') format('woff2');
  font-style: normal;
  font-weight: 200;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-Light.woff2') format('woff2');
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

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

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-Medium.woff2') format('woff2');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-SemiBold.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-Bold.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-ExtraBold.woff2') format('woff2');
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Thai';
  src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai-Black.woff2') format('woff2');
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

@import 'https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/NotoSerifThai/NotoSerifThai.css';

ใช้ CSS ด้านล่างนี้เพื่อกำหนดฟอนต์

font-family: 'Noto Serif Thai', serif;

รายชื่อไฟล์ที่ใช้งานได้

ด้านล่างนี้คือรายชื่อไฟล์ที่ใช้งานได้ทั้งหมดของฟอนต์นี้ สำหรับสร้าง @font-face ของคุณเอง

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38


var/NotoSerifThai[wdth,wght].woff2
var/NotoSerifThai[wght].woff2
NotoSerifThai-Black.woff2
NotoSerifThai-Bold.woff2
NotoSerifThai-Condensed.woff2
NotoSerifThai-CondensedBlack.woff2
NotoSerifThai-CondensedBold.woff2
NotoSerifThai-CondensedExtraBold.woff2
NotoSerifThai-CondensedExtraLight.woff2
NotoSerifThai-CondensedLight.woff2
NotoSerifThai-CondensedMedium.woff2
NotoSerifThai-CondensedSemiBold.woff2
NotoSerifThai-CondensedThin.woff2
NotoSerifThai-ExtraBold.woff2
NotoSerifThai-ExtraCondensed.woff2
NotoSerifThai-ExtraCondensedBlack.woff2
NotoSerifThai-ExtraCondensedBold.woff2
NotoSerifThai-ExtraCondensedExtraBold.woff2
NotoSerifThai-ExtraCondensedExtraLight.woff2
NotoSerifThai-ExtraCondensedLight.woff2
NotoSerifThai-ExtraCondensedMedium.woff2
NotoSerifThai-ExtraCondensedSemiBold.woff2
NotoSerifThai-ExtraCondensedThin.woff2
NotoSerifThai-ExtraLight.woff2
NotoSerifThai-Light.woff2
NotoSerifThai-Medium.woff2
NotoSerifThai-Regular.woff2
NotoSerifThai-SemiBold.woff2
NotoSerifThai-SemiCondensed.woff2
NotoSerifThai-SemiCondensedBlack.woff2
NotoSerifThai-SemiCondensedBold.woff2
NotoSerifThai-SemiCondensedExtraBold.woff2
NotoSerifThai-SemiCondensedExtraLight.woff2
NotoSerifThai-SemiCondensedLight.woff2
NotoSerifThai-SemiCondensedMedium.woff2
NotoSerifThai-SemiCondensedSemiBold.woff2
NotoSerifThai-SemiCondensedThin.woff2
NotoSerifThai-Thin.woff2

ข้อมูลฟอนต์

สัญญาอนุญาต: SIL Open Font License, version 1.1
เว็บไซต์: https://fonts.google.com/noto/specimen/Noto+Serif+Thai
ซอร์สโค้ด: https://github.com/notofonts/thai
ไทยเฟซ: https://thaifaces.com/specimen/noto-serif-thai/