Layout
flex display: flex
grid display: grid
hidden display: none
relative position: relative
absolute position: absolute
fixed position: fixed
z="10" z-index: 10
Flexbox
col flex-direction: column
row flex-direction: row
wrap flex-wrap: wrap
items="center" align-items
justify="between" justify-content
gap="4" gap: 1rem
grow flex-grow: 1
Spacing (p/m)
p="4" padding: 1rem
px="4" padding-x: 1rem
py="2" padding-y: 0.5rem
m="auto" margin: auto
mt="8" margin-top: 2rem
mx="auto" margin-x: auto
Sizing
w="full" width: 100%
h="screen" height: 100vh
w="300px" width: 300px
max-w="lg" max-width: 32rem
min-h="100vh" min-height: 100vh
Visuals
bg="primary" background-color
text="white" color
radius="lg" border-radius
shadow="md" box-shadow
border="1" border-width: 1px
opacity="0.5" opacity: 0.5
Transforms
scale="1.05" transform: scale()
rotate="45" transform: rotate()
translate-y="-2" transform: translateY()
skew-x="12" transform: skewX()
origin="center" transform-origin
Typography
size="1.2rem" font-size
weight="700" font-weight
align="center" text-align
leading="1.5" line-height
tracking="wide" letter-spacing
uppercase text-transform
Grid
grid display: grid
grid-cols="3" template-columns
col-span="2" grid-column
gap="4" gap
items="center" align-items