DM Sans + DM Serif Display

8/10 harmonious-elegant

ดูตัวอย่างสด

ข้อความตัวอย่าง หัวเรื่อง เนื้อหา

. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

ทำไมการจับคู่นี้จึงได้ผล

From the same design family, DM Sans and DM Serif share proportional DNA, creating natural harmony. The sans/serif contrast provides clear hierarchy.

ตัวอย่างตัวพิมพ์

หัวเรื่อง

ดูฟอนต์ →

DM Sans

AaBbCcDdEeFfGg

0123456789 !@#$%

Sans Serif 10 น้ำหนัก

เนื้อหา

ดูฟอนต์ →

DM Serif Display

AaBbCcDdEeFfGg

0123456789 !@#$%

Serif 1 น้ำหนัก

วิธีใช้

HTML

<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@100;1000;200;300;500;600;700;800;900;400&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:wght@400&display=swap" rel="stylesheet">

CSS

h1, h2, h3, h4, h5, h6 {
  font-family: 'DM Sans', sans-serif;
}

body, p, li {
  font-family: 'DM Serif Display', serif;
}

รายละเอียดการจับคู่

คะแนน: 8/10
อารมณ์: harmonious-elegant
หัวเรื่อง: DM Sans
เนื้อหา: DM Serif Display
หมวดหมู่หัวเรื่อง: Sans Serif
หมวดหมู่เนื้อหา: Serif

เหมาะสำหรับ

portfolio agency editorial