เครื่องมือนักพัฒนา
จับคู่ฟอนต์
เลือก Google Fonts สองตัวแล้วดูตัวอย่างเป็นหัวข้อ + เนื้อหาเพื่อหาคู่ตัวอักษรที่ลงตัว
Heading Font
36px
Body Font
16px
Playfair Display • 36px
The quick brown fox jumps
Source Sans 3 • 16px
Great typography creates hierarchy and readability. The right font pairing can make your design feel intentional, polished, and professional.
The bold weight of the body font and the italic variant both inherit the font family choice.
CSS
/* Import */
@import url('https://fonts.googleapis.com/css2?family=Playfair%20Display:wght@400;600;700&family=Source%20Sans%203:wght@400;700&display=swap');
h1, h2, h3 {
font-family: 'Playfair Display', serif;
font-size: 36px;
font-weight: 700;
}
body, p {
font-family: 'Source Sans 3', sans-serif;
font-size: 16px;
line-height: 1.7;
}Popular Pairings
สำรวจต่อ
เครื่องมือนักพัฒนา อื่นๆ ที่คุณอาจชอบ...
จัดรูปแบบ JSON
จัดรูปแบบ ตรวจสอบ และย่อข้อมูล JSON พร้อม syntax highlighting
ลองเลย
เข้ารหัส/ถอดรหัส Base64
เข้ารหัสข้อความเป็น Base64 และถอดรหัสสตริง Base64
ลองเลย
เข้ารหัส/ถอดรหัส URL
เข้ารหัสและถอดรหัสส่วนประกอบ URL และ query strings
ลองเลย
สร้าง UUID
สร้างตัวระบุ UUID v4 แบบสุ่ม
ลองเลย
สร้าง Hash
สร้างแฮช MD5, SHA-1, SHA-256 และ SHA-512 จากข้อความ
ลองเลย
ทดสอบ Regex
ทดสอบและดีบัก regular expressions พร้อมไฮไลท์การจับคู่
ลองเลย
ถอดรหัส JWT
ถอดรหัสและตรวจสอบ header และ payload ของ JWT token
ลองเลย
จัดรูปแบบ HTML
จัดรูปแบบโค้ด HTML พร้อมการเยื้องที่เหมาะสม
ลองเลย