UI SystemTuyển chọn

Tailwind CSS

Hệ thống utility-first giúp xây một giao diện responsive duy nhất thay vì phải duy trì riêng mobile, tablet và desktop.

Access Gate

0/1 bước

Hoàn thành 1 bước để tiếp tục

Tailwind CSS

Ủng hộ website Chưa hoàn thành

Cảm ơn bạn đã đồng hành

Bấm “Mở tab nhà tài trợ” để góp phần duy trì website và nguồn tài nguyên miễn phí. Sau khi mở tab, bạn quay lại đây để tiếp tục với nút “Truy cập tài nguyên”.

Mở tab nhà tài trợ

Trang nhà tài trợ và tài nguyên mở trong tab mới. Bạn có thể tiếp tục đọc bài tại đây.
Biên tập: Đăng
CSSresponsivedesign system
-
Trang chủ Tailwind CSS

Phù hợp với

  • Team xây design system responsive
  • Developer cần iterate UI nhanh
  • Dự án component-based

Vì sao đáng xem

  • Mobile-first breakpoint rõ ràng
  • Spacing và typography nhất quán
  • Responsive rule nằm ngay cạnh component

Tailwind không tự tạo ra giao diện đẹp, nhưng nó giúp diễn đạt responsive logic rất nhanh.

Với dự án này, class mặc định phục vụ mobile; khi màn hình rộng hơn mới thêm cột, sidebar và khoảng thở lớn hơn.

Điểm cần lưu ý

  • • Markup có thể dài nếu không tách component hợp lý
  • • Tailwind không thay thế tư duy thiết kế

Liên kết và tải về

Link ngoài và tài liệu liên quan

Đọc tiếp

Có thể bạn sẽ cần những thứ này tiếp theo

Bài viết

Thiết kế

Thiết kế resource page cho ngón tay cái, không phải chỉ cho màn hình desktop

Phần lớn traffic discovery đến từ điện thoại. Mobile-first buộc giao diện ưu tiên khả năng đọc, thao tác chạm và luồng thông tin.

Xem tiếp
Bài viết

Tuyển chọn

Collection nên kể một câu chuyện, không chỉ lọc database

Một collection tốt giải thích vì sao các item đi cùng nhau, nên xem theo thứ tự nào và lựa chọn nào hợp với từng nhóm người dùng.

Xem tiếp