Tailwind CSS Lookup

Tra cứu class Tailwind theo px value, hex màu hoặc typography — tìm token gần nhất, copy class ngay

Điểm nổi bật

Các điểm đáng chú ý nhất của công cụ này để bạn nắm nhanh trước khi dùng.

#01

Tra cứu Spacing px→token

Nhập giá trị px bất kỳ và tìm ngay token Tailwind tương ứng, hoặc duyệt toàn bộ bảng spacing.

#02

Tìm màu Tailwind gần nhất

Nhập mã hex của bạn, công cụ phân tích và trả về màu Tailwind gần nhất trong bảng màu chính thức.

#03

Tham chiếu Typography đầy đủ

Xem toàn bộ class font-size, font-weight và line-height của Tailwind kèm giá trị CSS tương ứng.

#04

Tìm kiếm nhanh trong ba tab

Mỗi tab có thanh tìm kiếm riêng giúp lọc kết quả tức thì mà không cần nhớ tên class chính xác.

Cách sử dụng

Làm theo từng bước để dùng công cụ nhanh và đúng intent ngay từ lần đầu.

1

Tab Spacing

Nhập giá trị px vào ô tìm kiếm để lọc ra token spacing phù hợp, hoặc cuộn xem toàn bộ bảng từ space-px đến space-96.

2

Tab Colors

Dán mã hex màu của bạn vào ô tìm kiếm. Công cụ tính khoảng cách màu và hiển thị các Tailwind color gần nhất.

3

Tab Typography

Tìm class chữ theo tên (như "xl", "bold", "tight") hoặc cuộn xem toàn bộ hệ thống typography của Tailwind.

4

Copy class

Click vào bất kỳ class nào để copy ngay vào clipboard, sẵn sàng dán vào file template.

Câu hỏi thường gặp

Những câu hỏi gặp nhiều nhất khi dùng công cụ, được trình bày ngắn gọn và dễ quét.

text-sm tương đương 14px (0.875rem) với line-height 20px, còn text-base là 16px (1rem) với line-height 24px — đây là kích thước văn bản mặc định của Tailwind.