Tailwind CSS Generator

Visually build Tailwind CSS classes

Preview:

Sample Element

Quick Presets:

bg Color

text Color

padding

margin

border Radius

font Size

font Weight

shadow

display

justify

align

width

height

hover

Generated Classes:

bg-blue-500 text-white p-4 m-0 rounded-lg text-base font-medium shadow-md flex justify-center items-center w-auto h-auto hover:bg-blue-600

HTML Example:

<div class="bg-blue-500 text-white p-4 m-0 rounded-lg text-base font-medium shadow-md flex justify-center items-center w-auto h-auto hover:bg-blue-600">Your content</div>