↔️ Một bộ công cụ,
mọi nhiệm vụ thiết kế

Máy tính Clamp

Tạo kiểu chữ linh hoạt với CSS clamp(). Đặt kích thước tối thiểu, ưu tiên và tối đa — nhận công thức clamp() hoàn hảo và bản xem trước thang tỷ lệ trực quan.

English 中文 日本語 한국어 Español Português Français Deutsch العربية हिन्दी ไทย Tiếng Việt Bahasa Русский

↔️ Máy tính Clamp

Hướng dẫn hàm Clamp

clamp() là hàm toán học CSS đặt giá trị giữa tối thiểu và tối đa: clamp(MIN, VAL, MAX). Trả về VAL miễn là nó nằm giữa MIN và MAX — khi VAL xuống dưới MIN thì trả MIN, khi vượt trên MAX thì trả MAX. Nhờ đó kiểu chữ linh hoạt khả thi mà không cần media query.

Đặt kích thước phông chữ tối thiểu và tối đa, cùng dải viewport nơi việc co giãn diễn ra. Công cụ tính công thức dựa trên vw hoàn hảo và hiển thị bản xem trước kích thước phông chữ ở sáu chiều rộng viewport, kèm đường cong biến đổi kích thước trên toàn dải.

Pro Tips

Frequently Asked Questions

Q: clamp() trong CSS làm gì?
clamp() trong CSS làm gì? clamp(MIN, VAL, MAX) chọn giá trị giữa MIN và MAX. Nếu VAL nhỏ hơn MIN thì trả MIN, lớn hơn MAX thì trả MAX, còn không thì trả VAL. Hoàn hảo cho kích thước linh hoạt không bao giờ quá nhỏ hay quá lớn.
Q: clamp() khác min() và max() thế nào?
clamp() khác min() và max() thế nào? min() chọn giá trị nhỏ nhất, max() chọn giá trị lớn nhất, clamp() kết hợp cả hai: kẹp giá trị giữa vào giữa giới hạn dưới và trên. clamp() là công cụ chủ lực của kiểu chữ linh hoạt.
Q: clamp() có được hỗ trợ ở mọi trình duyệt không?
clamp() có được hỗ trợ ở mọi trình duyệt không? Có. clamp(), min(), max() được hỗ trợ trong mọi trình duyệt hiện đại từ năm 2020 (Chrome 79+, Firefox 75+, Safari 13.1+).
Q: Nên dùng kích thước viewport nào cho kiểu chữ linh hoạt?
Nên dùng kích thước viewport nào cho kiểu chữ linh hoạt? Dải phổ biến là 320px-1200px cho trang thông thường, hoặc 360px-768px cho dự án mobile-first. Vượt quá vmax kích thước giữ cố định ở mức tối đa — đó là chủ ý.
Q: Có thể dùng clamp() cho khoảng cách không?
Có thể dùng clamp() cho khoảng cách không? Có. Padding và gap linh hoạt dùng cùng công thức: clamp(16px, 4vw, 48px). Khoảng cách linh hoạt giữ nhịp điệu giữa các thiết bị không cần thêm media query.

Màu sắc Việt Nam

Từ màu son đỏ của đình chùa đến màu nâu đất của làng quê, màu sắc Việt Nam gắn liền với lịch sử, nông nghiệp lúa nước và trang phục truyền thống áo dài.

Đỏ son #E32636

Màu son của cổng làng, đình chùa và câu đối

Vàng hoàng thái #FFD700

Màu vàng của hoàng cung và lễ hội

Xanh lam #0056A7

Màu xanh của biển Đông

Màu gạch #B22222

Màu gạch nung của làng quê Bắc Bộ

Vàng nắng #F7C948

Ánh nắng vàng trên cánh đồng lúa chín

Xanh ngọc #00A86B

Màu ngọc bích của vịnh Hạ Long

Tím Huế #7F5FA3

Màu tím của áo dài và hoa phượng tím xứ Huế

Nâu đất #8B5A2B

Màu đất phù sa của đồng bằng sông Hồng

Hồng sen #F5A9B8

Màu hoa sen — quốc hoa của Việt Nam

Trắng ngà #FFFFF0

Màu áo dài trắng của nữ sinh

Q: Màu đỏ son là gì?
Màu đỏ son là gì? Màu đỏ son (#E32636) là màu đỏ truyền thống được dùng để sơn cổng làng, đình chùa và câu đối Tết ở Việt Nam, tượng trưng cho may mắn và thịnh vượng.
Q: Màu tím Huế là gì?
Màu tím Huế là gì? Tím Huế (#7F5FA3) là màu tím đặc trưng của xứ Huế, gắn liền với áo dài tím, hoa phượng tím và nét lãng mạn của cố đô.