Ngày hôm nay chúng ta sẽ đi vào tìm hiểu các công cụ, thư viện, template, ví dụ... cho Tailwind CSS trong quá trình phát triển và thiết kế website nha.
tailblocks
Đây là nơi tổng hợp các component được viết sẵn bằng tailwind CSS. Bạn chỉ cần chọn UI mà mình yêu thích và sao chép code đó về cho dự án.
Tailwind-Typography-Playground
Tailwind-Typography-Playground giúp bạn có thể kiểm tra cách hiển thị của nội dung trang web bằng việc sử dụng các class phổ biến trong Tailwind.
tailwind ink
tailwind ink giúp chúng ta có thể dễ dàng chọn màu sắc và sao chép vào file thiết lập cho tailwind.
Tailwind Grids
Tailwind Grids giúp bạn có thể dễ dàng tạo layout cho trang web bằng tailwind dựa trên các thuộc tính có sẵn mà nó cung cấp.
Tailwind Palette Generator
Tailwind Palette Generator giúp bạn tạo bảng màu dễ dàng dành cho website sử dụng thư viện tailwind.
tailwind-tools
tailwind-tools là nơi tổng hợp các công cụ hữu ích dành cho tailwind như thiết lập bố cục bằng grid, tạo layout bằng flexbox, tạo bảng...
tailwind-cheat-sheet
tailwind-cheat-sheet tổng hợp đầy đủ các thuộc tính, class dành cho thư viện này.
tailwind run
tailwind run giúp chúng ta có thể dễ dàng chỉnh sửa và lập trình online cho thư viện tailwind css .
tailwind gradient
tailwind gradient giúp chúng ta dễ dàng tạo background gradient cho thành phần website.
Awesome Tailwind CSS
Awesome Tailwind CSS là nơi tổng hợp các nguồn tài liệu, công cụ hữu ích dành cho lập trình viên khi sử dụng thư viện tailwind.
Tailwind Weekly
Tailwind Weekly là nơi tổng hợp các bài viết hay được tổng hợp theo tuần dành riêng cho thư viện tailwind css.
Tailwind CSS Modal
Và kết quả bạn xem dưới đây nhé!
See the Pen Tailwind CSS Modal Demo with Animations by Marco Mark (@m2de) on CodePen.
TailwindCSS Dropdown
Và kết quả bạn xem dưới đây nhé!
See the Pen TailwindCSS Dropdown by M. Appelman (@huphtur) on CodePen.
Tailwind Responsive Card
Và kết quả bạn xem dưới đây nhé!
See the Pen Tailwind Responsive Card Component by Simon Vrachliotis (@simonswiss) on CodePen.
Tailwind Log In Page
Và kết quả bạn xem dưới đây nhé!
See the Pen Full-screen Log In Page by Sahil Vhora (@iamsahilvhora) on CodePen.
Tailwind Card
Và kết quả bạn xem dưới đây nhé!
See the Pen Tailwind Card by CodePen (@codepen) on CodePen.
Tailwind Form
Và kết quả bạn xem dưới đây nhé!
See the Pen Tailwind Form by Scott Zirkel (@scottzirkel) on CodePen.
Tailwind sidebar component
Và kết quả bạn xem dưới đây nhé!
See the Pen Tailwind page w/sidebar by Nikki Peel (@nikki-peel) on CodePen.
Tailwind CSS pricing
Và kết quả bạn xem dưới đây nhé!
See the Pen Tailwind CSS pricing panel responsive by francescomansi (@framansi) on CodePen.
Landing Page Tailwind CSS
Và kết quả bạn xem dưới đây nhé!
See the Pen Landing Page — Tailwind CSS by Mert Cukuren (@knyttneve) on CodePen.
Landing Page Tailwind CSS
Và kết quả bạn xem dưới đây nhé!
See the Pen Landing Page — Tailwind CSS by Mert Cukuren (@knyttneve) on CodePen.
Tổng kết:
Qua đây mình mong bài viết sẽ cung cấp thêm cho bạn những công cụ tailwind CSS hữu ích cho việc phát triển, thiết kế web và nếu có thắc mắc gì cứ gửi email mình sẽ phản hồi sớm nhất có thể. Rất mong bạn tiếp tục ủng hộ trang web để mình có thể viết nhiều bài hay hơn nữa nhé. Chúc bạn có một ngày vui vẻ!
