Thư viện thuật ngữ / UI/UX

Line height là gì?

Còn gọi: chiều cao dòng

Line height là chiều cao của mỗi dòng chữ, quyết định khoảng cách giữa các dòng trong một đoạn văn; trong in ấn khái niệm tương ứng gọi là leading.

Line height (chiều cao dòng)

Hiểu kỹ hơn

Trên web và trong Figma, line height được tính cho cả dòng, phần dư chia đều trên và dưới chữ, khác với leading trong InDesign đo từ đường chân chữ dòng này tới dòng kế tiếp. Chữ thân bài thường hợp với chiều cao dòng khoảng 1,4 đến 1,6 lần cỡ chữ, ví dụ chữ 16px dùng 24px. Tiêu đề lớn cần chiều cao dòng chặt hơn, khoảng 1,1 đến 1,3. WCAG 2.2 tiêu chí 1.4.12 yêu cầu nội dung không bị vỡ khi người dùng tự tăng chiều cao dòng lên 1,5 lần. Trong Figma, line height có thể đặt Auto, theo px hoặc theo %, và nên làm tròn để chiều cao dòng là bội số của 4 cho khớp hệ thống khoảng cách. Ví dụ: chữ tiếng Việt có dấu chồng trên chữ hoa như Ẩ, Ỗ cần line height rộng hơn một chút để dấu không chạm dòng trên. Lỗi thường gặp là để Auto cho mọi chữ, khiến mỗi font cho chiều cao khác nhau và khó căn khối.