Skip to content
Menu
Menu
Home
Image Tools
Image Format Converter
Image Cropper
Image Rotator
Image Filter Preview
Image To Text
Image to Color Picker
Image To Base64
Base64 To Image
Image Compressor
Text Tools
Remove Extra Spaces
Text to Uppercase
Text to Lowercase
Text Duplicate Remover
Text to Morse Code
Find and Replace Tool
Text Joiner
Text to Binary Converter
Binary to Text Converter
Text Encryptor / Decryptor
Designers Tools
HEX to RGB Converter
RGB to HEX Converter
CSS Gradient Generator
CSS Box Shadow Generator
CSS Border Radius Generator
Glass morphism Generator
CSS Flexbox Playground
CSS Text Shadow Generator
Box Sizing Visualizer
CSS Grid Layout Generator
Calculation Tools
Calorie Calculator
BMR Calculator
Percentage Calculator
Tip Calculator
Body Fat Percentage Estimator
Discount Calculator
GST/Tax Calculator
Time Difference Calculator
Mortgage Affordability Calculator
Fuel Cost Calculator
Tailwind CSS Class Generator
Configuration
Dark Mode
Width
Default
w-1
w-2
w-4
w-8
w-12
w-16
w-20
w-24
w-32
w-40
w-48
w-56
w-64
w-auto
w-px
w-1/2
w-1/3
w-2/3
w-1/4
w-2/4
w-3/4
w-1/5
w-2/5
w-3/5
w-4/5
w-1/6
w-2/6
w-3/6
w-4/6
w-5/6
w-full
w-screen
Height
Default
h-1
h-2
h-4
h-8
h-12
h-16
h-20
h-24
h-32
h-40
h-48
h-56
h-64
h-auto
h-px
h-full
h-screen
Padding
p-0
p-1
p-2
p-3
p-4
p-5
p-6
p-8
px-2
px-4
px-6
py-2
py-4
py-6
Margin
m-0
m-1
m-2
m-3
m-4
m-5
m-6
m-8
mx-auto
mx-2
mx-4
my-2
my-4
Display
block
inline-block
inline
flex
inline-flex
grid
inline-grid
Flex Direction
flex-row
flex-row-reverse
flex-col
flex-col-reverse
Justify Content
justify-start
justify-end
justify-center
justify-between
justify-around
justify-evenly
Align Items
items-start
items-end
items-center
items-baseline
items-stretch
Text Color
Background Color
Font Size
text-xs
text-sm
text-base
text-lg
text-xl
text-2xl
text-3xl
text-4xl
Font Weight
font-thin
font-light
font-normal
font-medium
font-semibold
font-bold
font-extrabold
Border Radius
rounded-none
rounded-sm
rounded
rounded-md
rounded-lg
rounded-xl
rounded-2xl
rounded-full
Shadow
shadow-none
shadow-sm
shadow
shadow-md
shadow-lg
shadow-xl
shadow-inner
Hover Effects
hover:bg-gray-100
hover:bg-blue-100
hover:shadow-md
hover:opacity-75
hover:scale-105
Transition
transition-none
transition-all
transition-colors
transition-opacity
transition-transform
duration-75
duration-100
duration-150
duration-200
duration-300
Preview & Output
Preview Content
Hover Me
Generated Tailwind Classes
No classes selected yet
Copy Classes
Reset All
Preview Text
Custom Classes
Add Custom Classes
Search for:
