Sizing values

The number in h-<number>, w-<number>, p-<number>, m-<number> and etc in Tailwind CSS represents a specific size based on a predefined scale. 1 unit typically corresponds to 0.25rem (4px), so h-1 would be 0.25rem, h-2 would be 0.5rem, and so on. This allows for consistent spacing and sizing throughout your design. Here is an example of possible value in a table format:

ClassSize (rem)Size (px)
h-10.25rem4px
h-20.5rem8px
h-30.75rem12px
h-41rem16px
h-51.25rem20px
h-61.5rem24px
h-82rem32px
h-102.5rem40px
h-123rem48px
h-164rem64px
h-205rem80px
h-246rem96px
h-328rem128px
h-4010rem160px
h-4812rem192px
h-5614rem224px
h-6416rem256px
h-7218rem288px
h-8020rem320px
h-9624rem384px

All possible values

ClassCSS ValueSize (px)
h-00px0px
h-px1px1px
h-0.50.125rem2px
h-10.25rem4px
h-1.50.375rem6px
h-20.5rem8px
h-2.50.625rem10px
h-30.75rem12px
h-3.50.875rem14px
h-41rem16px
h-51.25rem20px
h-61.5rem24px
h-71.75rem28px
h-82rem32px
h-92.25rem36px
h-102.5rem40px
h-112.75rem44px
h-123rem48px
h-143.5rem56px
h-164rem64px
h-205rem80px
h-246rem96px
h-287rem112px
h-328rem128px
h-369rem144px
h-4010rem160px
h-4411rem176px
h-4812rem192px
h-5213rem208px
h-5614rem224px
h-6015rem240px
h-6416rem256px
h-7218rem288px
h-8020rem320px
h-9624rem384px