Utilities
Spacing
Padding, margin, gap and space between, on a 0.25rem scale with logical start and end sides.
796classes
4,229variant classes
22properties
Live example
<div class="flex flex-wrap items-end gap-4">
<div class="rounded-lg bg-primary/10 p-2"><div class="size-8 rounded bg-primary"></div></div>
<div class="rounded-lg bg-primary/10 p-4"><div class="size-8 rounded bg-primary"></div></div>
<div class="rounded-lg bg-primary/10 p-6"><div class="size-8 rounded bg-primary"></div></div>
<div class="rounded-lg bg-primary/10 px-8 py-2"><div class="size-8 rounded bg-primary"></div></div>
<div class="space-y-2 rounded-lg border p-3"><div class="h-2 w-24 rounded bg-muted-foreground/40"></div><div class="h-2 w-16 rounded bg-muted-foreground/40"></div><div class="h-2 w-20 rounded bg-muted-foreground/40"></div></div>
</div>Variant support
Variants are generated where they are useful, which keeps the whole stylesheet small enough to link from a CDN. Prefix a class with one of these to apply it in that state or above that width, for example md:gap-0. Stacked variants such as dark:hover: are not part of the prebuilt file; arbitrary values take any variant, stacked, with the optional script or the purge CLI.
| Kind | Prefixes | Classes in this category |
|---|---|---|
| State | not generated | 0 |
| Group and peer | not generated | 0 |
| Structure | first:last:odd:even: | 14 |
| Motion | not generated | 0 |
| Scheme | not generated | 0 |
| Breakpoints | sm:md:lg:xl:2xl: | 449 |
| Containers | @xs:@sm:@md:@lg:@xl: | 108 |
| Media and direction | print:screen:rtl:ltr: | 449 |
Gap 33
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
gap-0 | gap: 0; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-1 | gap: 0.25rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-2 | gap: 0.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-3 | gap: 0.75rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-4 | gap: 1rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-5 | gap: 1.25rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-6 | gap: 1.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-7 | gap: 1.75rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-8 | gap: 2rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-9 | gap: 2.25rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-10 | gap: 2.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-11 | gap: 2.75rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-12 | gap: 3rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-14 | gap: 3.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-16 | gap: 4rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-20 | gap: 5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-24 | gap: 6rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-32 | gap: 8rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-40 | gap: 10rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-48 | gap: 12rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-64 | gap: 16rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-px | gap: 1px; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-0.5 | gap: 0.125rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-1.5 | gap: 0.375rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-2.5 | gap: 0.625rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-3.5 | gap: 0.875rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
gap-fluid-xs | gap: clamp(0.5rem, 0.4022rem + 0.4348vw, 0.75rem); | |
gap-fluid-sm | gap: clamp(0.75rem, 0.5543rem + 0.8696vw, 1.25rem); | |
gap-fluid-md | gap: clamp(1rem, 0.6087rem + 1.7391vw, 2rem); | |
gap-fluid-lg | gap: clamp(1.5rem, 0.913rem + 2.6087vw, 3rem); | |
gap-fluid-xl | gap: clamp(2rem, 1.2174rem + 3.4783vw, 4rem); | |
gap-fluid-2xl | gap: clamp(3rem, 1.8261rem + 5.2174vw, 6rem); | |
gap-fluid-3xl | gap: clamp(4rem, 2.4348rem + 6.9565vw, 8rem); |
Column gap 26
Variants: sm:md:lg:xl:2xl:@xs:@sm:@md:@lg:@xl:print:screen:
| Class | CSS |
|---|---|
gap-x-0 | column-gap: 0; |
gap-x-1 | column-gap: 0.25rem; |
gap-x-2 | column-gap: 0.5rem; |
gap-x-3 | column-gap: 0.75rem; |
gap-x-4 | column-gap: 1rem; |
gap-x-5 | column-gap: 1.25rem; |
gap-x-6 | column-gap: 1.5rem; |
gap-x-7 | column-gap: 1.75rem; |
gap-x-8 | column-gap: 2rem; |
gap-x-9 | column-gap: 2.25rem; |
gap-x-10 | column-gap: 2.5rem; |
gap-x-11 | column-gap: 2.75rem; |
gap-x-12 | column-gap: 3rem; |
gap-x-14 | column-gap: 3.5rem; |
gap-x-16 | column-gap: 4rem; |
gap-x-20 | column-gap: 5rem; |
gap-x-24 | column-gap: 6rem; |
gap-x-32 | column-gap: 8rem; |
gap-x-40 | column-gap: 10rem; |
gap-x-48 | column-gap: 12rem; |
gap-x-64 | column-gap: 16rem; |
gap-x-px | column-gap: 1px; |
gap-x-0.5 | column-gap: 0.125rem; |
gap-x-1.5 | column-gap: 0.375rem; |
gap-x-2.5 | column-gap: 0.625rem; |
gap-x-3.5 | column-gap: 0.875rem; |
Row gap 26
Variants: sm:md:lg:xl:2xl:@xs:@sm:@md:@lg:@xl:print:screen:
| Class | CSS |
|---|---|
gap-y-0 | row-gap: 0; |
gap-y-1 | row-gap: 0.25rem; |
gap-y-2 | row-gap: 0.5rem; |
gap-y-3 | row-gap: 0.75rem; |
gap-y-4 | row-gap: 1rem; |
gap-y-5 | row-gap: 1.25rem; |
gap-y-6 | row-gap: 1.5rem; |
gap-y-7 | row-gap: 1.75rem; |
gap-y-8 | row-gap: 2rem; |
gap-y-9 | row-gap: 2.25rem; |
gap-y-10 | row-gap: 2.5rem; |
gap-y-11 | row-gap: 2.75rem; |
gap-y-12 | row-gap: 3rem; |
gap-y-14 | row-gap: 3.5rem; |
gap-y-16 | row-gap: 4rem; |
gap-y-20 | row-gap: 5rem; |
gap-y-24 | row-gap: 6rem; |
gap-y-32 | row-gap: 8rem; |
gap-y-40 | row-gap: 10rem; |
gap-y-48 | row-gap: 12rem; |
gap-y-64 | row-gap: 16rem; |
gap-y-px | row-gap: 1px; |
gap-y-0.5 | row-gap: 0.125rem; |
gap-y-1.5 | row-gap: 0.375rem; |
gap-y-2.5 | row-gap: 0.625rem; |
gap-y-3.5 | row-gap: 0.875rem; |
Padding 33
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
p-0 | padding: 0; | first last odd even sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-1 | padding: 0.25rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-2 | padding: 0.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-3 | padding: 0.75rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-4 | padding: 1rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-5 | padding: 1.25rem; | sm md lg xl 2xl print screen |
p-6 | padding: 1.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-7 | padding: 1.75rem; | sm md lg xl 2xl print screen |
p-8 | padding: 2rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-9 | padding: 2.25rem; | sm md lg xl 2xl print screen |
p-10 | padding: 2.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-11 | padding: 2.75rem; | sm md lg xl 2xl print screen |
p-12 | padding: 3rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-14 | padding: 3.5rem; | sm md lg xl 2xl print screen |
p-16 | padding: 4rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
p-20 | padding: 5rem; | sm md lg xl 2xl print screen |
p-24 | padding: 6rem; | sm md lg xl 2xl print screen |
p-32 | padding: 8rem; | sm md lg xl 2xl print screen |
p-40 | padding: 10rem; | sm md lg xl 2xl print screen |
p-48 | padding: 12rem; | sm md lg xl 2xl print screen |
p-64 | padding: 16rem; | sm md lg xl 2xl print screen |
p-px | padding: 1px; | sm md lg xl 2xl print screen |
p-0.5 | padding: 0.125rem; | sm md lg xl 2xl print screen |
p-1.5 | padding: 0.375rem; | sm md lg xl 2xl print screen |
p-2.5 | padding: 0.625rem; | sm md lg xl 2xl print screen |
p-3.5 | padding: 0.875rem; | sm md lg xl 2xl print screen |
p-fluid-xs | padding: clamp(0.5rem, 0.4022rem + 0.4348vw, 0.75rem); | |
p-fluid-sm | padding: clamp(0.75rem, 0.5543rem + 0.8696vw, 1.25rem); | |
p-fluid-md | padding: clamp(1rem, 0.6087rem + 1.7391vw, 2rem); | |
p-fluid-lg | padding: clamp(1.5rem, 0.913rem + 2.6087vw, 3rem); | |
p-fluid-xl | padding: clamp(2rem, 1.2174rem + 3.4783vw, 4rem); | |
p-fluid-2xl | padding: clamp(3rem, 1.8261rem + 5.2174vw, 6rem); | |
p-fluid-3xl | padding: clamp(4rem, 2.4348rem + 6.9565vw, 8rem); |
Padding inline 33
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
px-0 | padding-inline: 0; | first last odd even rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-1 | padding-inline: 0.25rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-2 | padding-inline: 0.5rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-3 | padding-inline: 0.75rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-4 | padding-inline: 1rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-5 | padding-inline: 1.25rem; | rtl ltr sm md lg xl 2xl print screen |
px-6 | padding-inline: 1.5rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-7 | padding-inline: 1.75rem; | rtl ltr sm md lg xl 2xl print screen |
px-8 | padding-inline: 2rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-9 | padding-inline: 2.25rem; | rtl ltr sm md lg xl 2xl print screen |
px-10 | padding-inline: 2.5rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-11 | padding-inline: 2.75rem; | rtl ltr sm md lg xl 2xl print screen |
px-12 | padding-inline: 3rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-14 | padding-inline: 3.5rem; | rtl ltr sm md lg xl 2xl print screen |
px-16 | padding-inline: 4rem; | rtl ltr sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
px-20 | padding-inline: 5rem; | rtl ltr sm md lg xl 2xl print screen |
px-24 | padding-inline: 6rem; | rtl ltr sm md lg xl 2xl print screen |
px-32 | padding-inline: 8rem; | rtl ltr sm md lg xl 2xl print screen |
px-40 | padding-inline: 10rem; | rtl ltr sm md lg xl 2xl print screen |
px-48 | padding-inline: 12rem; | rtl ltr sm md lg xl 2xl print screen |
px-64 | padding-inline: 16rem; | rtl ltr sm md lg xl 2xl print screen |
px-px | padding-inline: 1px; | rtl ltr sm md lg xl 2xl print screen |
px-0.5 | padding-inline: 0.125rem; | rtl ltr sm md lg xl 2xl print screen |
px-1.5 | padding-inline: 0.375rem; | rtl ltr sm md lg xl 2xl print screen |
px-2.5 | padding-inline: 0.625rem; | rtl ltr sm md lg xl 2xl print screen |
px-3.5 | padding-inline: 0.875rem; | rtl ltr sm md lg xl 2xl print screen |
px-fluid-xs | padding-inline: clamp(0.5rem, 0.4022rem + 0.4348vw, 0.75rem); | rtl ltr |
px-fluid-sm | padding-inline: clamp(0.75rem, 0.5543rem + 0.8696vw, 1.25rem); | rtl ltr |
px-fluid-md | padding-inline: clamp(1rem, 0.6087rem + 1.7391vw, 2rem); | rtl ltr |
px-fluid-lg | padding-inline: clamp(1.5rem, 0.913rem + 2.6087vw, 3rem); | rtl ltr |
px-fluid-xl | padding-inline: clamp(2rem, 1.2174rem + 3.4783vw, 4rem); | rtl ltr |
px-fluid-2xl | padding-inline: clamp(3rem, 1.8261rem + 5.2174vw, 6rem); | rtl ltr |
px-fluid-3xl | padding-inline: clamp(4rem, 2.4348rem + 6.9565vw, 8rem); | rtl ltr |
Padding block 33
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
py-0 | padding-block: 0; | first last odd even sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-1 | padding-block: 0.25rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-2 | padding-block: 0.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-3 | padding-block: 0.75rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-4 | padding-block: 1rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-5 | padding-block: 1.25rem; | sm md lg xl 2xl print screen |
py-6 | padding-block: 1.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-7 | padding-block: 1.75rem; | sm md lg xl 2xl print screen |
py-8 | padding-block: 2rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-9 | padding-block: 2.25rem; | sm md lg xl 2xl print screen |
py-10 | padding-block: 2.5rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-11 | padding-block: 2.75rem; | sm md lg xl 2xl print screen |
py-12 | padding-block: 3rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-14 | padding-block: 3.5rem; | sm md lg xl 2xl print screen |
py-16 | padding-block: 4rem; | sm md lg xl 2xl @xs @sm @md @lg @xl print screen |
py-20 | padding-block: 5rem; | sm md lg xl 2xl print screen |
py-24 | padding-block: 6rem; | sm md lg xl 2xl print screen |
py-32 | padding-block: 8rem; | sm md lg xl 2xl print screen |
py-40 | padding-block: 10rem; | sm md lg xl 2xl print screen |
py-48 | padding-block: 12rem; | sm md lg xl 2xl print screen |
py-64 | padding-block: 16rem; | sm md lg xl 2xl print screen |
py-px | padding-block: 1px; | sm md lg xl 2xl print screen |
py-0.5 | padding-block: 0.125rem; | sm md lg xl 2xl print screen |
py-1.5 | padding-block: 0.375rem; | sm md lg xl 2xl print screen |
py-2.5 | padding-block: 0.625rem; | sm md lg xl 2xl print screen |
py-3.5 | padding-block: 0.875rem; | sm md lg xl 2xl print screen |
py-fluid-xs | padding-block: clamp(0.5rem, 0.4022rem + 0.4348vw, 0.75rem); | |
py-fluid-sm | padding-block: clamp(0.75rem, 0.5543rem + 0.8696vw, 1.25rem); | |
py-fluid-md | padding-block: clamp(1rem, 0.6087rem + 1.7391vw, 2rem); | |
py-fluid-lg | padding-block: clamp(1.5rem, 0.913rem + 2.6087vw, 3rem); | |
py-fluid-xl | padding-block: clamp(2rem, 1.2174rem + 3.4783vw, 4rem); | |
py-fluid-2xl | padding-block: clamp(3rem, 1.8261rem + 5.2174vw, 6rem); | |
py-fluid-3xl | padding-block: clamp(4rem, 2.4348rem + 6.9565vw, 8rem); |
Padding top 26
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
pt-0 | padding-top: 0; | first last odd even sm md lg xl 2xl print screen |
pt-1 | padding-top: 0.25rem; | sm md lg xl 2xl print screen |
pt-2 | padding-top: 0.5rem; | sm md lg xl 2xl print screen |
pt-3 | padding-top: 0.75rem; | sm md lg xl 2xl print screen |
pt-4 | padding-top: 1rem; | sm md lg xl 2xl print screen |
pt-5 | padding-top: 1.25rem; | sm md lg xl 2xl print screen |
pt-6 | padding-top: 1.5rem; | sm md lg xl 2xl print screen |
pt-7 | padding-top: 1.75rem; | sm md lg xl 2xl print screen |
pt-8 | padding-top: 2rem; | sm md lg xl 2xl print screen |
pt-9 | padding-top: 2.25rem; | sm md lg xl 2xl print screen |
pt-10 | padding-top: 2.5rem; | sm md lg xl 2xl print screen |
pt-11 | padding-top: 2.75rem; | sm md lg xl 2xl print screen |
pt-12 | padding-top: 3rem; | sm md lg xl 2xl print screen |
pt-14 | padding-top: 3.5rem; | sm md lg xl 2xl print screen |
pt-16 | padding-top: 4rem; | sm md lg xl 2xl print screen |
pt-20 | padding-top: 5rem; | sm md lg xl 2xl print screen |
pt-24 | padding-top: 6rem; | sm md lg xl 2xl print screen |
pt-32 | padding-top: 8rem; | sm md lg xl 2xl print screen |
pt-40 | padding-top: 10rem; | sm md lg xl 2xl print screen |
pt-48 | padding-top: 12rem; | sm md lg xl 2xl print screen |
pt-64 | padding-top: 16rem; | sm md lg xl 2xl print screen |
pt-px | padding-top: 1px; | sm md lg xl 2xl print screen |
pt-0.5 | padding-top: 0.125rem; | sm md lg xl 2xl print screen |
pt-1.5 | padding-top: 0.375rem; | sm md lg xl 2xl print screen |
pt-2.5 | padding-top: 0.625rem; | sm md lg xl 2xl print screen |
pt-3.5 | padding-top: 0.875rem; | sm md lg xl 2xl print screen |
Padding right 26
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
pr-0 | padding-right: 0; | first last odd even rtl ltr sm md lg xl 2xl print screen |
pr-1 | padding-right: 0.25rem; | rtl ltr sm md lg xl 2xl print screen |
pr-2 | padding-right: 0.5rem; | rtl ltr sm md lg xl 2xl print screen |
pr-3 | padding-right: 0.75rem; | rtl ltr sm md lg xl 2xl print screen |
pr-4 | padding-right: 1rem; | rtl ltr sm md lg xl 2xl print screen |
pr-5 | padding-right: 1.25rem; | rtl ltr sm md lg xl 2xl print screen |
pr-6 | padding-right: 1.5rem; | rtl ltr sm md lg xl 2xl print screen |
pr-7 | padding-right: 1.75rem; | rtl ltr sm md lg xl 2xl print screen |
pr-8 | padding-right: 2rem; | rtl ltr sm md lg xl 2xl print screen |
pr-9 | padding-right: 2.25rem; | rtl ltr sm md lg xl 2xl print screen |
pr-10 | padding-right: 2.5rem; | rtl ltr sm md lg xl 2xl print screen |
pr-11 | padding-right: 2.75rem; | rtl ltr sm md lg xl 2xl print screen |
pr-12 | padding-right: 3rem; | rtl ltr sm md lg xl 2xl print screen |
pr-14 | padding-right: 3.5rem; | rtl ltr sm md lg xl 2xl print screen |
pr-16 | padding-right: 4rem; | rtl ltr sm md lg xl 2xl print screen |
pr-20 | padding-right: 5rem; | rtl ltr sm md lg xl 2xl print screen |
pr-24 | padding-right: 6rem; | rtl ltr sm md lg xl 2xl print screen |
pr-32 | padding-right: 8rem; | rtl ltr sm md lg xl 2xl print screen |
pr-40 | padding-right: 10rem; | rtl ltr sm md lg xl 2xl print screen |
pr-48 | padding-right: 12rem; | rtl ltr sm md lg xl 2xl print screen |
pr-64 | padding-right: 16rem; | rtl ltr sm md lg xl 2xl print screen |
pr-px | padding-right: 1px; | rtl ltr sm md lg xl 2xl print screen |
pr-0.5 | padding-right: 0.125rem; | rtl ltr sm md lg xl 2xl print screen |
pr-1.5 | padding-right: 0.375rem; | rtl ltr sm md lg xl 2xl print screen |
pr-2.5 | padding-right: 0.625rem; | rtl ltr sm md lg xl 2xl print screen |
pr-3.5 | padding-right: 0.875rem; | rtl ltr sm md lg xl 2xl print screen |
Padding bottom 26
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
pb-0 | padding-bottom: 0; | first last odd even sm md lg xl 2xl print screen |
pb-1 | padding-bottom: 0.25rem; | sm md lg xl 2xl print screen |
pb-2 | padding-bottom: 0.5rem; | sm md lg xl 2xl print screen |
pb-3 | padding-bottom: 0.75rem; | sm md lg xl 2xl print screen |
pb-4 | padding-bottom: 1rem; | sm md lg xl 2xl print screen |
pb-5 | padding-bottom: 1.25rem; | sm md lg xl 2xl print screen |
pb-6 | padding-bottom: 1.5rem; | sm md lg xl 2xl print screen |
pb-7 | padding-bottom: 1.75rem; | sm md lg xl 2xl print screen |
pb-8 | padding-bottom: 2rem; | sm md lg xl 2xl print screen |
pb-9 | padding-bottom: 2.25rem; | sm md lg xl 2xl print screen |
pb-10 | padding-bottom: 2.5rem; | sm md lg xl 2xl print screen |
pb-11 | padding-bottom: 2.75rem; | sm md lg xl 2xl print screen |
pb-12 | padding-bottom: 3rem; | sm md lg xl 2xl print screen |
pb-14 | padding-bottom: 3.5rem; | sm md lg xl 2xl print screen |
pb-16 | padding-bottom: 4rem; | sm md lg xl 2xl print screen |
pb-20 | padding-bottom: 5rem; | sm md lg xl 2xl print screen |
pb-24 | padding-bottom: 6rem; | sm md lg xl 2xl print screen |
pb-32 | padding-bottom: 8rem; | sm md lg xl 2xl print screen |
pb-40 | padding-bottom: 10rem; | sm md lg xl 2xl print screen |
pb-48 | padding-bottom: 12rem; | sm md lg xl 2xl print screen |
pb-64 | padding-bottom: 16rem; | sm md lg xl 2xl print screen |
pb-px | padding-bottom: 1px; | sm md lg xl 2xl print screen |
pb-0.5 | padding-bottom: 0.125rem; | sm md lg xl 2xl print screen |
pb-1.5 | padding-bottom: 0.375rem; | sm md lg xl 2xl print screen |
pb-2.5 | padding-bottom: 0.625rem; | sm md lg xl 2xl print screen |
pb-3.5 | padding-bottom: 0.875rem; | sm md lg xl 2xl print screen |
Padding left 26
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
pl-0 | padding-left: 0; | first last odd even rtl ltr sm md lg xl 2xl print screen |
pl-1 | padding-left: 0.25rem; | rtl ltr sm md lg xl 2xl print screen |
pl-2 | padding-left: 0.5rem; | rtl ltr sm md lg xl 2xl print screen |
pl-3 | padding-left: 0.75rem; | rtl ltr sm md lg xl 2xl print screen |
pl-4 | padding-left: 1rem; | rtl ltr sm md lg xl 2xl print screen |
pl-5 | padding-left: 1.25rem; | rtl ltr sm md lg xl 2xl print screen |
pl-6 | padding-left: 1.5rem; | rtl ltr sm md lg xl 2xl print screen |
pl-7 | padding-left: 1.75rem; | rtl ltr sm md lg xl 2xl print screen |
pl-8 | padding-left: 2rem; | rtl ltr sm md lg xl 2xl print screen |
pl-9 | padding-left: 2.25rem; | rtl ltr sm md lg xl 2xl print screen |
pl-10 | padding-left: 2.5rem; | rtl ltr sm md lg xl 2xl print screen |
pl-11 | padding-left: 2.75rem; | rtl ltr sm md lg xl 2xl print screen |
pl-12 | padding-left: 3rem; | rtl ltr sm md lg xl 2xl print screen |
pl-14 | padding-left: 3.5rem; | rtl ltr sm md lg xl 2xl print screen |
pl-16 | padding-left: 4rem; | rtl ltr sm md lg xl 2xl print screen |
pl-20 | padding-left: 5rem; | rtl ltr sm md lg xl 2xl print screen |
pl-24 | padding-left: 6rem; | rtl ltr sm md lg xl 2xl print screen |
pl-32 | padding-left: 8rem; | rtl ltr sm md lg xl 2xl print screen |
pl-40 | padding-left: 10rem; | rtl ltr sm md lg xl 2xl print screen |
pl-48 | padding-left: 12rem; | rtl ltr sm md lg xl 2xl print screen |
pl-64 | padding-left: 16rem; | rtl ltr sm md lg xl 2xl print screen |
pl-px | padding-left: 1px; | rtl ltr sm md lg xl 2xl print screen |
pl-0.5 | padding-left: 0.125rem; | rtl ltr sm md lg xl 2xl print screen |
pl-1.5 | padding-left: 0.375rem; | rtl ltr sm md lg xl 2xl print screen |
pl-2.5 | padding-left: 0.625rem; | rtl ltr sm md lg xl 2xl print screen |
pl-3.5 | padding-left: 0.875rem; | rtl ltr sm md lg xl 2xl print screen |
Padding inline start 26
Variants: none
| Class | CSS |
|---|---|
ps-0 | padding-inline-start: 0; |
ps-1 | padding-inline-start: 0.25rem; |
ps-2 | padding-inline-start: 0.5rem; |
ps-3 | padding-inline-start: 0.75rem; |
ps-4 | padding-inline-start: 1rem; |
ps-5 | padding-inline-start: 1.25rem; |
ps-6 | padding-inline-start: 1.5rem; |
ps-7 | padding-inline-start: 1.75rem; |
ps-8 | padding-inline-start: 2rem; |
ps-9 | padding-inline-start: 2.25rem; |
ps-10 | padding-inline-start: 2.5rem; |
ps-11 | padding-inline-start: 2.75rem; |
ps-12 | padding-inline-start: 3rem; |
ps-14 | padding-inline-start: 3.5rem; |
ps-16 | padding-inline-start: 4rem; |
ps-20 | padding-inline-start: 5rem; |
ps-24 | padding-inline-start: 6rem; |
ps-32 | padding-inline-start: 8rem; |
ps-40 | padding-inline-start: 10rem; |
ps-48 | padding-inline-start: 12rem; |
ps-64 | padding-inline-start: 16rem; |
ps-px | padding-inline-start: 1px; |
ps-0.5 | padding-inline-start: 0.125rem; |
ps-1.5 | padding-inline-start: 0.375rem; |
ps-2.5 | padding-inline-start: 0.625rem; |
ps-3.5 | padding-inline-start: 0.875rem; |
Padding inline end 26
Variants: none
| Class | CSS |
|---|---|
pe-0 | padding-inline-end: 0; |
pe-1 | padding-inline-end: 0.25rem; |
pe-2 | padding-inline-end: 0.5rem; |
pe-3 | padding-inline-end: 0.75rem; |
pe-4 | padding-inline-end: 1rem; |
pe-5 | padding-inline-end: 1.25rem; |
pe-6 | padding-inline-end: 1.5rem; |
pe-7 | padding-inline-end: 1.75rem; |
pe-8 | padding-inline-end: 2rem; |
pe-9 | padding-inline-end: 2.25rem; |
pe-10 | padding-inline-end: 2.5rem; |
pe-11 | padding-inline-end: 2.75rem; |
pe-12 | padding-inline-end: 3rem; |
pe-14 | padding-inline-end: 3.5rem; |
pe-16 | padding-inline-end: 4rem; |
pe-20 | padding-inline-end: 5rem; |
pe-24 | padding-inline-end: 6rem; |
pe-32 | padding-inline-end: 8rem; |
pe-40 | padding-inline-end: 10rem; |
pe-48 | padding-inline-end: 12rem; |
pe-64 | padding-inline-end: 16rem; |
pe-px | padding-inline-end: 1px; |
pe-0.5 | padding-inline-end: 0.125rem; |
pe-1.5 | padding-inline-end: 0.375rem; |
pe-2.5 | padding-inline-end: 0.625rem; |
pe-3.5 | padding-inline-end: 0.875rem; |
Margin 50
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
m-0 | margin: 0; | first last odd even sm md lg xl 2xl print screen |
m-1 | margin: 0.25rem; | sm md lg xl 2xl print screen |
m-2 | margin: 0.5rem; | sm md lg xl 2xl print screen |
m-3 | margin: 0.75rem; | sm md lg xl 2xl print screen |
m-4 | margin: 1rem; | sm md lg xl 2xl print screen |
m-5 | margin: 1.25rem; | sm md lg xl 2xl print screen |
m-6 | margin: 1.5rem; | sm md lg xl 2xl print screen |
m-7 | margin: 1.75rem; | sm md lg xl 2xl print screen |
m-8 | margin: 2rem; | sm md lg xl 2xl print screen |
m-9 | margin: 2.25rem; | sm md lg xl 2xl print screen |
m-10 | margin: 2.5rem; | sm md lg xl 2xl print screen |
m-11 | margin: 2.75rem; | sm md lg xl 2xl print screen |
m-12 | margin: 3rem; | sm md lg xl 2xl print screen |
m-14 | margin: 3.5rem; | sm md lg xl 2xl print screen |
m-16 | margin: 4rem; | sm md lg xl 2xl print screen |
m-20 | margin: 5rem; | sm md lg xl 2xl print screen |
m-24 | margin: 6rem; | sm md lg xl 2xl print screen |
m-32 | margin: 8rem; | sm md lg xl 2xl print screen |
m-40 | margin: 10rem; | sm md lg xl 2xl print screen |
m-48 | margin: 12rem; | sm md lg xl 2xl print screen |
m-64 | margin: 16rem; | sm md lg xl 2xl print screen |
m-px | margin: 1px; | sm md lg xl 2xl print screen |
m-0.5 | margin: 0.125rem; | sm md lg xl 2xl print screen |
m-1.5 | margin: 0.375rem; | sm md lg xl 2xl print screen |
m-2.5 | margin: 0.625rem; | sm md lg xl 2xl print screen |
m-3.5 | margin: 0.875rem; | sm md lg xl 2xl print screen |
m-auto | margin: auto; | sm md lg xl 2xl print screen |
-m-1 | margin: -0.25rem; | |
-m-2 | margin: -0.5rem; | |
-m-3 | margin: -0.75rem; | |
-m-4 | margin: -1rem; | |
-m-5 | margin: -1.25rem; | |
-m-6 | margin: -1.5rem; | |
-m-8 | margin: -2rem; | |
-m-10 | margin: -2.5rem; | |
-m-12 | margin: -3rem; | |
-m-16 | margin: -4rem; | |
-m-20 | margin: -5rem; | |
-m-24 | margin: -6rem; | |
-m-px | margin: -1px; | |
-m-0.5 | margin: -0.125rem; | |
-m-1.5 | margin: -0.375rem; | |
-m-2.5 | margin: -0.625rem; | |
m-fluid-xs | margin: clamp(0.5rem, 0.4022rem + 0.4348vw, 0.75rem); | |
m-fluid-sm | margin: clamp(0.75rem, 0.5543rem + 0.8696vw, 1.25rem); | |
m-fluid-md | margin: clamp(1rem, 0.6087rem + 1.7391vw, 2rem); | |
m-fluid-lg | margin: clamp(1.5rem, 0.913rem + 2.6087vw, 3rem); | |
m-fluid-xl | margin: clamp(2rem, 1.2174rem + 3.4783vw, 4rem); | |
m-fluid-2xl | margin: clamp(3rem, 1.8261rem + 5.2174vw, 6rem); | |
m-fluid-3xl | margin: clamp(4rem, 2.4348rem + 6.9565vw, 8rem); |
Margin inline 43
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
mx-0 | margin-inline: 0; | first last odd even rtl ltr sm md lg xl 2xl print screen |
mx-1 | margin-inline: 0.25rem; | rtl ltr sm md lg xl 2xl print screen |
mx-2 | margin-inline: 0.5rem; | rtl ltr sm md lg xl 2xl print screen |
mx-3 | margin-inline: 0.75rem; | rtl ltr sm md lg xl 2xl print screen |
mx-4 | margin-inline: 1rem; | rtl ltr sm md lg xl 2xl print screen |
mx-5 | margin-inline: 1.25rem; | rtl ltr sm md lg xl 2xl print screen |
mx-6 | margin-inline: 1.5rem; | rtl ltr sm md lg xl 2xl print screen |
mx-7 | margin-inline: 1.75rem; | rtl ltr sm md lg xl 2xl print screen |
mx-8 | margin-inline: 2rem; | rtl ltr sm md lg xl 2xl print screen |
mx-9 | margin-inline: 2.25rem; | rtl ltr sm md lg xl 2xl print screen |
mx-10 | margin-inline: 2.5rem; | rtl ltr sm md lg xl 2xl print screen |
mx-11 | margin-inline: 2.75rem; | rtl ltr sm md lg xl 2xl print screen |
mx-12 | margin-inline: 3rem; | rtl ltr sm md lg xl 2xl print screen |
mx-14 | margin-inline: 3.5rem; | rtl ltr sm md lg xl 2xl print screen |
mx-16 | margin-inline: 4rem; | rtl ltr sm md lg xl 2xl print screen |
mx-20 | margin-inline: 5rem; | rtl ltr sm md lg xl 2xl print screen |
mx-24 | margin-inline: 6rem; | rtl ltr sm md lg xl 2xl print screen |
mx-32 | margin-inline: 8rem; | rtl ltr sm md lg xl 2xl print screen |
mx-40 | margin-inline: 10rem; | rtl ltr sm md lg xl 2xl print screen |
mx-48 | margin-inline: 12rem; | rtl ltr sm md lg xl 2xl print screen |
mx-64 | margin-inline: 16rem; | rtl ltr sm md lg xl 2xl print screen |
mx-px | margin-inline: 1px; | rtl ltr sm md lg xl 2xl print screen |
mx-0.5 | margin-inline: 0.125rem; | rtl ltr sm md lg xl 2xl print screen |
mx-1.5 | margin-inline: 0.375rem; | rtl ltr sm md lg xl 2xl print screen |
mx-2.5 | margin-inline: 0.625rem; | rtl ltr sm md lg xl 2xl print screen |
mx-3.5 | margin-inline: 0.875rem; | rtl ltr sm md lg xl 2xl print screen |
mx-auto | margin-inline: auto; | rtl ltr sm md lg xl 2xl print screen |
-mx-1 | margin-inline: -0.25rem; | rtl ltr |
-mx-2 | margin-inline: -0.5rem; | rtl ltr |
-mx-3 | margin-inline: -0.75rem; | rtl ltr |
-mx-4 | margin-inline: -1rem; | rtl ltr |
-mx-5 | margin-inline: -1.25rem; | rtl ltr |
-mx-6 | margin-inline: -1.5rem; | rtl ltr |
-mx-8 | margin-inline: -2rem; | rtl ltr |
-mx-10 | margin-inline: -2.5rem; | rtl ltr |
-mx-12 | margin-inline: -3rem; | rtl ltr |
-mx-16 | margin-inline: -4rem; | rtl ltr |
-mx-20 | margin-inline: -5rem; | rtl ltr |
-mx-24 | margin-inline: -6rem; | rtl ltr |
-mx-px | margin-inline: -1px; | rtl ltr |
-mx-0.5 | margin-inline: -0.125rem; | rtl ltr |
-mx-1.5 | margin-inline: -0.375rem; | rtl ltr |
-mx-2.5 | margin-inline: -0.625rem; | rtl ltr |
Margin block 43
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
my-0 | margin-block: 0; | first last odd even sm md lg xl 2xl print screen |
my-1 | margin-block: 0.25rem; | sm md lg xl 2xl print screen |
my-2 | margin-block: 0.5rem; | sm md lg xl 2xl print screen |
my-3 | margin-block: 0.75rem; | sm md lg xl 2xl print screen |
my-4 | margin-block: 1rem; | sm md lg xl 2xl print screen |
my-5 | margin-block: 1.25rem; | sm md lg xl 2xl print screen |
my-6 | margin-block: 1.5rem; | sm md lg xl 2xl print screen |
my-7 | margin-block: 1.75rem; | sm md lg xl 2xl print screen |
my-8 | margin-block: 2rem; | sm md lg xl 2xl print screen |
my-9 | margin-block: 2.25rem; | sm md lg xl 2xl print screen |
my-10 | margin-block: 2.5rem; | sm md lg xl 2xl print screen |
my-11 | margin-block: 2.75rem; | sm md lg xl 2xl print screen |
my-12 | margin-block: 3rem; | sm md lg xl 2xl print screen |
my-14 | margin-block: 3.5rem; | sm md lg xl 2xl print screen |
my-16 | margin-block: 4rem; | sm md lg xl 2xl print screen |
my-20 | margin-block: 5rem; | sm md lg xl 2xl print screen |
my-24 | margin-block: 6rem; | sm md lg xl 2xl print screen |
my-32 | margin-block: 8rem; | sm md lg xl 2xl print screen |
my-40 | margin-block: 10rem; | sm md lg xl 2xl print screen |
my-48 | margin-block: 12rem; | sm md lg xl 2xl print screen |
my-64 | margin-block: 16rem; | sm md lg xl 2xl print screen |
my-px | margin-block: 1px; | sm md lg xl 2xl print screen |
my-0.5 | margin-block: 0.125rem; | sm md lg xl 2xl print screen |
my-1.5 | margin-block: 0.375rem; | sm md lg xl 2xl print screen |
my-2.5 | margin-block: 0.625rem; | sm md lg xl 2xl print screen |
my-3.5 | margin-block: 0.875rem; | sm md lg xl 2xl print screen |
my-auto | margin-block: auto; | sm md lg xl 2xl print screen |
-my-1 | margin-block: -0.25rem; | |
-my-2 | margin-block: -0.5rem; | |
-my-3 | margin-block: -0.75rem; | |
-my-4 | margin-block: -1rem; | |
-my-5 | margin-block: -1.25rem; | |
-my-6 | margin-block: -1.5rem; | |
-my-8 | margin-block: -2rem; | |
-my-10 | margin-block: -2.5rem; | |
-my-12 | margin-block: -3rem; | |
-my-16 | margin-block: -4rem; | |
-my-20 | margin-block: -5rem; | |
-my-24 | margin-block: -6rem; | |
-my-px | margin-block: -1px; | |
-my-0.5 | margin-block: -0.125rem; | |
-my-1.5 | margin-block: -0.375rem; | |
-my-2.5 | margin-block: -0.625rem; |
Margin top 43
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
mt-0 | margin-top: 0; | first last odd even sm md lg xl 2xl print screen |
mt-1 | margin-top: 0.25rem; | sm md lg xl 2xl print screen |
mt-2 | margin-top: 0.5rem; | sm md lg xl 2xl print screen |
mt-3 | margin-top: 0.75rem; | sm md lg xl 2xl print screen |
mt-4 | margin-top: 1rem; | sm md lg xl 2xl print screen |
mt-5 | margin-top: 1.25rem; | sm md lg xl 2xl print screen |
mt-6 | margin-top: 1.5rem; | sm md lg xl 2xl print screen |
mt-7 | margin-top: 1.75rem; | sm md lg xl 2xl print screen |
mt-8 | margin-top: 2rem; | sm md lg xl 2xl print screen |
mt-9 | margin-top: 2.25rem; | sm md lg xl 2xl print screen |
mt-10 | margin-top: 2.5rem; | sm md lg xl 2xl print screen |
mt-11 | margin-top: 2.75rem; | sm md lg xl 2xl print screen |
mt-12 | margin-top: 3rem; | sm md lg xl 2xl print screen |
mt-14 | margin-top: 3.5rem; | sm md lg xl 2xl print screen |
mt-16 | margin-top: 4rem; | sm md lg xl 2xl print screen |
mt-20 | margin-top: 5rem; | sm md lg xl 2xl print screen |
mt-24 | margin-top: 6rem; | sm md lg xl 2xl print screen |
mt-32 | margin-top: 8rem; | sm md lg xl 2xl print screen |
mt-40 | margin-top: 10rem; | sm md lg xl 2xl print screen |
mt-48 | margin-top: 12rem; | sm md lg xl 2xl print screen |
mt-64 | margin-top: 16rem; | sm md lg xl 2xl print screen |
mt-px | margin-top: 1px; | sm md lg xl 2xl print screen |
mt-0.5 | margin-top: 0.125rem; | sm md lg xl 2xl print screen |
mt-1.5 | margin-top: 0.375rem; | sm md lg xl 2xl print screen |
mt-2.5 | margin-top: 0.625rem; | sm md lg xl 2xl print screen |
mt-3.5 | margin-top: 0.875rem; | sm md lg xl 2xl print screen |
mt-auto | margin-top: auto; | sm md lg xl 2xl print screen |
-mt-1 | margin-top: -0.25rem; | |
-mt-2 | margin-top: -0.5rem; | |
-mt-3 | margin-top: -0.75rem; | |
-mt-4 | margin-top: -1rem; | |
-mt-5 | margin-top: -1.25rem; | |
-mt-6 | margin-top: -1.5rem; | |
-mt-8 | margin-top: -2rem; | |
-mt-10 | margin-top: -2.5rem; | |
-mt-12 | margin-top: -3rem; | |
-mt-16 | margin-top: -4rem; | |
-mt-20 | margin-top: -5rem; | |
-mt-24 | margin-top: -6rem; | |
-mt-px | margin-top: -1px; | |
-mt-0.5 | margin-top: -0.125rem; | |
-mt-1.5 | margin-top: -0.375rem; | |
-mt-2.5 | margin-top: -0.625rem; |
Margin right 43
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
mr-0 | margin-right: 0; | first last odd even rtl ltr sm md lg xl 2xl print screen |
mr-1 | margin-right: 0.25rem; | rtl ltr sm md lg xl 2xl print screen |
mr-2 | margin-right: 0.5rem; | rtl ltr sm md lg xl 2xl print screen |
mr-3 | margin-right: 0.75rem; | rtl ltr sm md lg xl 2xl print screen |
mr-4 | margin-right: 1rem; | rtl ltr sm md lg xl 2xl print screen |
mr-5 | margin-right: 1.25rem; | rtl ltr sm md lg xl 2xl print screen |
mr-6 | margin-right: 1.5rem; | rtl ltr sm md lg xl 2xl print screen |
mr-7 | margin-right: 1.75rem; | rtl ltr sm md lg xl 2xl print screen |
mr-8 | margin-right: 2rem; | rtl ltr sm md lg xl 2xl print screen |
mr-9 | margin-right: 2.25rem; | rtl ltr sm md lg xl 2xl print screen |
mr-10 | margin-right: 2.5rem; | rtl ltr sm md lg xl 2xl print screen |
mr-11 | margin-right: 2.75rem; | rtl ltr sm md lg xl 2xl print screen |
mr-12 | margin-right: 3rem; | rtl ltr sm md lg xl 2xl print screen |
mr-14 | margin-right: 3.5rem; | rtl ltr sm md lg xl 2xl print screen |
mr-16 | margin-right: 4rem; | rtl ltr sm md lg xl 2xl print screen |
mr-20 | margin-right: 5rem; | rtl ltr sm md lg xl 2xl print screen |
mr-24 | margin-right: 6rem; | rtl ltr sm md lg xl 2xl print screen |
mr-32 | margin-right: 8rem; | rtl ltr sm md lg xl 2xl print screen |
mr-40 | margin-right: 10rem; | rtl ltr sm md lg xl 2xl print screen |
mr-48 | margin-right: 12rem; | rtl ltr sm md lg xl 2xl print screen |
mr-64 | margin-right: 16rem; | rtl ltr sm md lg xl 2xl print screen |
mr-px | margin-right: 1px; | rtl ltr sm md lg xl 2xl print screen |
mr-0.5 | margin-right: 0.125rem; | rtl ltr sm md lg xl 2xl print screen |
mr-1.5 | margin-right: 0.375rem; | rtl ltr sm md lg xl 2xl print screen |
mr-2.5 | margin-right: 0.625rem; | rtl ltr sm md lg xl 2xl print screen |
mr-3.5 | margin-right: 0.875rem; | rtl ltr sm md lg xl 2xl print screen |
mr-auto | margin-right: auto; | rtl ltr sm md lg xl 2xl print screen |
-mr-1 | margin-right: -0.25rem; | rtl ltr |
-mr-2 | margin-right: -0.5rem; | rtl ltr |
-mr-3 | margin-right: -0.75rem; | rtl ltr |
-mr-4 | margin-right: -1rem; | rtl ltr |
-mr-5 | margin-right: -1.25rem; | rtl ltr |
-mr-6 | margin-right: -1.5rem; | rtl ltr |
-mr-8 | margin-right: -2rem; | rtl ltr |
-mr-10 | margin-right: -2.5rem; | rtl ltr |
-mr-12 | margin-right: -3rem; | rtl ltr |
-mr-16 | margin-right: -4rem; | rtl ltr |
-mr-20 | margin-right: -5rem; | rtl ltr |
-mr-24 | margin-right: -6rem; | rtl ltr |
-mr-px | margin-right: -1px; | rtl ltr |
-mr-0.5 | margin-right: -0.125rem; | rtl ltr |
-mr-1.5 | margin-right: -0.375rem; | rtl ltr |
-mr-2.5 | margin-right: -0.625rem; | rtl ltr |
Margin bottom 43
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
mb-0 | margin-bottom: 0; | first last odd even sm md lg xl 2xl print screen |
mb-1 | margin-bottom: 0.25rem; | sm md lg xl 2xl print screen |
mb-2 | margin-bottom: 0.5rem; | sm md lg xl 2xl print screen |
mb-3 | margin-bottom: 0.75rem; | sm md lg xl 2xl print screen |
mb-4 | margin-bottom: 1rem; | sm md lg xl 2xl print screen |
mb-5 | margin-bottom: 1.25rem; | sm md lg xl 2xl print screen |
mb-6 | margin-bottom: 1.5rem; | sm md lg xl 2xl print screen |
mb-7 | margin-bottom: 1.75rem; | sm md lg xl 2xl print screen |
mb-8 | margin-bottom: 2rem; | sm md lg xl 2xl print screen |
mb-9 | margin-bottom: 2.25rem; | sm md lg xl 2xl print screen |
mb-10 | margin-bottom: 2.5rem; | sm md lg xl 2xl print screen |
mb-11 | margin-bottom: 2.75rem; | sm md lg xl 2xl print screen |
mb-12 | margin-bottom: 3rem; | sm md lg xl 2xl print screen |
mb-14 | margin-bottom: 3.5rem; | sm md lg xl 2xl print screen |
mb-16 | margin-bottom: 4rem; | sm md lg xl 2xl print screen |
mb-20 | margin-bottom: 5rem; | sm md lg xl 2xl print screen |
mb-24 | margin-bottom: 6rem; | sm md lg xl 2xl print screen |
mb-32 | margin-bottom: 8rem; | sm md lg xl 2xl print screen |
mb-40 | margin-bottom: 10rem; | sm md lg xl 2xl print screen |
mb-48 | margin-bottom: 12rem; | sm md lg xl 2xl print screen |
mb-64 | margin-bottom: 16rem; | sm md lg xl 2xl print screen |
mb-px | margin-bottom: 1px; | sm md lg xl 2xl print screen |
mb-0.5 | margin-bottom: 0.125rem; | sm md lg xl 2xl print screen |
mb-1.5 | margin-bottom: 0.375rem; | sm md lg xl 2xl print screen |
mb-2.5 | margin-bottom: 0.625rem; | sm md lg xl 2xl print screen |
mb-3.5 | margin-bottom: 0.875rem; | sm md lg xl 2xl print screen |
mb-auto | margin-bottom: auto; | sm md lg xl 2xl print screen |
-mb-1 | margin-bottom: -0.25rem; | |
-mb-2 | margin-bottom: -0.5rem; | |
-mb-3 | margin-bottom: -0.75rem; | |
-mb-4 | margin-bottom: -1rem; | |
-mb-5 | margin-bottom: -1.25rem; | |
-mb-6 | margin-bottom: -1.5rem; | |
-mb-8 | margin-bottom: -2rem; | |
-mb-10 | margin-bottom: -2.5rem; | |
-mb-12 | margin-bottom: -3rem; | |
-mb-16 | margin-bottom: -4rem; | |
-mb-20 | margin-bottom: -5rem; | |
-mb-24 | margin-bottom: -6rem; | |
-mb-px | margin-bottom: -1px; | |
-mb-0.5 | margin-bottom: -0.125rem; | |
-mb-1.5 | margin-bottom: -0.375rem; | |
-mb-2.5 | margin-bottom: -0.625rem; |
Margin left 43
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
ml-0 | margin-left: 0; | first last odd even rtl ltr sm md lg xl 2xl print screen |
ml-1 | margin-left: 0.25rem; | rtl ltr sm md lg xl 2xl print screen |
ml-2 | margin-left: 0.5rem; | rtl ltr sm md lg xl 2xl print screen |
ml-3 | margin-left: 0.75rem; | rtl ltr sm md lg xl 2xl print screen |
ml-4 | margin-left: 1rem; | rtl ltr sm md lg xl 2xl print screen |
ml-5 | margin-left: 1.25rem; | rtl ltr sm md lg xl 2xl print screen |
ml-6 | margin-left: 1.5rem; | rtl ltr sm md lg xl 2xl print screen |
ml-7 | margin-left: 1.75rem; | rtl ltr sm md lg xl 2xl print screen |
ml-8 | margin-left: 2rem; | rtl ltr sm md lg xl 2xl print screen |
ml-9 | margin-left: 2.25rem; | rtl ltr sm md lg xl 2xl print screen |
ml-10 | margin-left: 2.5rem; | rtl ltr sm md lg xl 2xl print screen |
ml-11 | margin-left: 2.75rem; | rtl ltr sm md lg xl 2xl print screen |
ml-12 | margin-left: 3rem; | rtl ltr sm md lg xl 2xl print screen |
ml-14 | margin-left: 3.5rem; | rtl ltr sm md lg xl 2xl print screen |
ml-16 | margin-left: 4rem; | rtl ltr sm md lg xl 2xl print screen |
ml-20 | margin-left: 5rem; | rtl ltr sm md lg xl 2xl print screen |
ml-24 | margin-left: 6rem; | rtl ltr sm md lg xl 2xl print screen |
ml-32 | margin-left: 8rem; | rtl ltr sm md lg xl 2xl print screen |
ml-40 | margin-left: 10rem; | rtl ltr sm md lg xl 2xl print screen |
ml-48 | margin-left: 12rem; | rtl ltr sm md lg xl 2xl print screen |
ml-64 | margin-left: 16rem; | rtl ltr sm md lg xl 2xl print screen |
ml-px | margin-left: 1px; | rtl ltr sm md lg xl 2xl print screen |
ml-0.5 | margin-left: 0.125rem; | rtl ltr sm md lg xl 2xl print screen |
ml-1.5 | margin-left: 0.375rem; | rtl ltr sm md lg xl 2xl print screen |
ml-2.5 | margin-left: 0.625rem; | rtl ltr sm md lg xl 2xl print screen |
ml-3.5 | margin-left: 0.875rem; | rtl ltr sm md lg xl 2xl print screen |
ml-auto | margin-left: auto; | rtl ltr sm md lg xl 2xl print screen |
-ml-1 | margin-left: -0.25rem; | rtl ltr |
-ml-2 | margin-left: -0.5rem; | rtl ltr |
-ml-3 | margin-left: -0.75rem; | rtl ltr |
-ml-4 | margin-left: -1rem; | rtl ltr |
-ml-5 | margin-left: -1.25rem; | rtl ltr |
-ml-6 | margin-left: -1.5rem; | rtl ltr |
-ml-8 | margin-left: -2rem; | rtl ltr |
-ml-10 | margin-left: -2.5rem; | rtl ltr |
-ml-12 | margin-left: -3rem; | rtl ltr |
-ml-16 | margin-left: -4rem; | rtl ltr |
-ml-20 | margin-left: -5rem; | rtl ltr |
-ml-24 | margin-left: -6rem; | rtl ltr |
-ml-px | margin-left: -1px; | rtl ltr |
-ml-0.5 | margin-left: -0.125rem; | rtl ltr |
-ml-1.5 | margin-left: -0.375rem; | rtl ltr |
-ml-2.5 | margin-left: -0.625rem; | rtl ltr |
Margin inline start 43
Variants: none
| Class | CSS |
|---|---|
ms-0 | margin-inline-start: 0; |
ms-1 | margin-inline-start: 0.25rem; |
ms-2 | margin-inline-start: 0.5rem; |
ms-3 | margin-inline-start: 0.75rem; |
ms-4 | margin-inline-start: 1rem; |
ms-5 | margin-inline-start: 1.25rem; |
ms-6 | margin-inline-start: 1.5rem; |
ms-7 | margin-inline-start: 1.75rem; |
ms-8 | margin-inline-start: 2rem; |
ms-9 | margin-inline-start: 2.25rem; |
ms-10 | margin-inline-start: 2.5rem; |
ms-11 | margin-inline-start: 2.75rem; |
ms-12 | margin-inline-start: 3rem; |
ms-14 | margin-inline-start: 3.5rem; |
ms-16 | margin-inline-start: 4rem; |
ms-20 | margin-inline-start: 5rem; |
ms-24 | margin-inline-start: 6rem; |
ms-32 | margin-inline-start: 8rem; |
ms-40 | margin-inline-start: 10rem; |
ms-48 | margin-inline-start: 12rem; |
ms-64 | margin-inline-start: 16rem; |
ms-px | margin-inline-start: 1px; |
ms-0.5 | margin-inline-start: 0.125rem; |
ms-1.5 | margin-inline-start: 0.375rem; |
ms-2.5 | margin-inline-start: 0.625rem; |
ms-3.5 | margin-inline-start: 0.875rem; |
ms-auto | margin-inline-start: auto; |
-ms-1 | margin-inline-start: -0.25rem; |
-ms-2 | margin-inline-start: -0.5rem; |
-ms-3 | margin-inline-start: -0.75rem; |
-ms-4 | margin-inline-start: -1rem; |
-ms-5 | margin-inline-start: -1.25rem; |
-ms-6 | margin-inline-start: -1.5rem; |
-ms-8 | margin-inline-start: -2rem; |
-ms-10 | margin-inline-start: -2.5rem; |
-ms-12 | margin-inline-start: -3rem; |
-ms-16 | margin-inline-start: -4rem; |
-ms-20 | margin-inline-start: -5rem; |
-ms-24 | margin-inline-start: -6rem; |
-ms-px | margin-inline-start: -1px; |
-ms-0.5 | margin-inline-start: -0.125rem; |
-ms-1.5 | margin-inline-start: -0.375rem; |
-ms-2.5 | margin-inline-start: -0.625rem; |
Margin inline end 74
Variants: listed per class
| Class | CSS | Variants |
|---|---|---|
me-0 | margin-inline-end: 0; | |
me-1 | margin-inline-end: 0.25rem; | |
me-2 | margin-inline-end: 0.5rem; | |
me-3 | margin-inline-end: 0.75rem; | |
me-4 | margin-inline-end: 1rem; | |
me-5 | margin-inline-end: 1.25rem; | |
me-6 | margin-inline-end: 1.5rem; | |
me-7 | margin-inline-end: 1.75rem; | |
me-8 | margin-inline-end: 2rem; | |
me-9 | margin-inline-end: 2.25rem; | |
me-10 | margin-inline-end: 2.5rem; | |
me-11 | margin-inline-end: 2.75rem; | |
me-12 | margin-inline-end: 3rem; | |
me-14 | margin-inline-end: 3.5rem; | |
me-16 | margin-inline-end: 4rem; | |
me-20 | margin-inline-end: 5rem; | |
me-24 | margin-inline-end: 6rem; | |
me-32 | margin-inline-end: 8rem; | |
me-40 | margin-inline-end: 10rem; | |
me-48 | margin-inline-end: 12rem; | |
me-64 | margin-inline-end: 16rem; | |
me-px | margin-inline-end: 1px; | |
me-0.5 | margin-inline-end: 0.125rem; | |
me-1.5 | margin-inline-end: 0.375rem; | |
me-2.5 | margin-inline-end: 0.625rem; | |
me-3.5 | margin-inline-end: 0.875rem; | |
me-auto | margin-inline-end: auto; | |
-me-1 | margin-inline-end: -0.25rem; | |
-me-2 | margin-inline-end: -0.5rem; | |
-me-3 | margin-inline-end: -0.75rem; | |
-me-4 | margin-inline-end: -1rem; | |
-me-5 | margin-inline-end: -1.25rem; | |
-me-6 | margin-inline-end: -1.5rem; | |
-me-8 | margin-inline-end: -2rem; | |
-me-10 | margin-inline-end: -2.5rem; | |
-me-12 | margin-inline-end: -3rem; | |
-me-16 | margin-inline-end: -4rem; | |
-me-20 | margin-inline-end: -5rem; | |
-me-24 | margin-inline-end: -6rem; | |
-me-px | margin-inline-end: -1px; | |
-me-0.5 | margin-inline-end: -0.125rem; | |
-me-1.5 | margin-inline-end: -0.375rem; | |
-me-2.5 | margin-inline-end: -0.625rem; | |
space-x-0 | margin-inline-end: 0; | rtl ltr |
space-x-1 | margin-inline-end: 0.25rem; | rtl ltr |
space-x-2 | margin-inline-end: 0.5rem; | rtl ltr |
space-x-3 | margin-inline-end: 0.75rem; | rtl ltr |
space-x-4 | margin-inline-end: 1rem; | rtl ltr |
space-x-5 | margin-inline-end: 1.25rem; | rtl ltr |
space-x-6 | margin-inline-end: 1.5rem; | rtl ltr |
space-x-7 | margin-inline-end: 1.75rem; | rtl ltr |
space-x-8 | margin-inline-end: 2rem; | rtl ltr |
space-x-9 | margin-inline-end: 2.25rem; | rtl ltr |
space-x-10 | margin-inline-end: 2.5rem; | rtl ltr |
space-x-11 | margin-inline-end: 2.75rem; | rtl ltr |
space-x-12 | margin-inline-end: 3rem; | rtl ltr |
space-x-14 | margin-inline-end: 3.5rem; | rtl ltr |
space-x-16 | margin-inline-end: 4rem; | rtl ltr |
space-x-20 | margin-inline-end: 5rem; | rtl ltr |
space-x-24 | margin-inline-end: 6rem; | rtl ltr |
space-x-32 | margin-inline-end: 8rem; | rtl ltr |
space-x-40 | margin-inline-end: 10rem; | rtl ltr |
space-x-48 | margin-inline-end: 12rem; | rtl ltr |
space-x-64 | margin-inline-end: 16rem; | rtl ltr |
space-x-px | margin-inline-end: 1px; | rtl ltr |
space-x-0.5 | margin-inline-end: 0.125rem; | rtl ltr |
space-x-1.5 | margin-inline-end: 0.375rem; | rtl ltr |
space-x-2.5 | margin-inline-end: 0.625rem; | rtl ltr |
space-x-3.5 | margin-inline-end: 0.875rem; | rtl ltr |
-space-x-1 | margin-inline-end: -0.25rem; | rtl ltr |
-space-x-2 | margin-inline-end: -0.5rem; | rtl ltr |
-space-x-4 | margin-inline-end: -1rem; | rtl ltr |
-space-x-px | margin-inline-end: -1px; | rtl ltr |
-space-x-0.5 | margin-inline-end: -0.125rem; | rtl ltr |
Margin block end 31
Variants: none
| Class | CSS |
|---|---|
space-y-0 | margin-block-end: 0; |
space-y-1 | margin-block-end: 0.25rem; |
space-y-2 | margin-block-end: 0.5rem; |
space-y-3 | margin-block-end: 0.75rem; |
space-y-4 | margin-block-end: 1rem; |
space-y-5 | margin-block-end: 1.25rem; |
space-y-6 | margin-block-end: 1.5rem; |
space-y-7 | margin-block-end: 1.75rem; |
space-y-8 | margin-block-end: 2rem; |
space-y-9 | margin-block-end: 2.25rem; |
space-y-10 | margin-block-end: 2.5rem; |
space-y-11 | margin-block-end: 2.75rem; |
space-y-12 | margin-block-end: 3rem; |
space-y-14 | margin-block-end: 3.5rem; |
space-y-16 | margin-block-end: 4rem; |
space-y-20 | margin-block-end: 5rem; |
space-y-24 | margin-block-end: 6rem; |
space-y-32 | margin-block-end: 8rem; |
space-y-40 | margin-block-end: 10rem; |
space-y-48 | margin-block-end: 12rem; |
space-y-64 | margin-block-end: 16rem; |
space-y-px | margin-block-end: 1px; |
space-y-0.5 | margin-block-end: 0.125rem; |
space-y-1.5 | margin-block-end: 0.375rem; |
space-y-2.5 | margin-block-end: 0.625rem; |
space-y-3.5 | margin-block-end: 0.875rem; |
-space-y-1 | margin-block-end: -0.25rem; |
-space-y-2 | margin-block-end: -0.5rem; |
-space-y-4 | margin-block-end: -1rem; |
-space-y-px | margin-block-end: -1px; |
-space-y-0.5 | margin-block-end: -0.125rem; |