Taman Bermain Tailwind
Uji dan pratinjau kelas Tailwind CSS secara real-time.
Pengaturan
Konfigurasikan jenis dan konten elemen
Contoh Preset
Terapkan kombinasi gaya yang umum digunakan dengan cepat
Button
Card
Badge
Alert
Input
Pratinjau
Lihat hasil gaya real-time
Halo, Tailwind!
HTML yang Dihasilkan
Kode HTML yang dihasilkan dengan pengaturan saat ini
<div className="bg-blue-500 text-white p-4 rounded-lg shadow-md hover:bg-blue-600 transition-colors">Halo, Tailwind!</div>
๐ก Kiat Penggunaan
Kelas Umum:
- โข
hover:- Gaya status hover - โข
focus:- Gaya status fokus - โข
active:- Gaya status aktif - โข
transition-colors- Efek transisi warna
Kelas Responsif:
- โข
sm:- 640px ke atas - โข
md:- 768px ke atas - โข
lg:- 1024px ke atas - โข
xl:- 1280px ke atas