A list of more specific theme keys for Tailwind CSS v4 I can't find documented elsewhere. The more specific key overrides the less specific key.
| api | theme keys | property |
|---|---|---|
| accent | { --color, --accent-color } | accent-color |
| animate | { --animate } | animation |
| aspect | { --aspect } | aspect-ratio |
| backdrop-blur | { --blur, --backdrop-blur } | --tw-backdrop-blur |
| backdrop-brightness | { --brightness, --backdrop-brightness } | --tw-backdrop-brightness |
| backdrop-contrast | { --contrast, --backdrop-contrast } | --tw-backdrop-contrast |
| backdrop-grayscale | { --grayscale, --backdrop-grayscale } | --tw-backdrop-grayscale |
| backdrop-hue-rotate | { --hue-rotate, --backdrop-hue-rotate } | --tw-backdrop-hue-rotate |
| backdrop-invert | { --invert, --backdrop-invert } | --tw-backdrop-invert |
| backdrop-opacity | { --opacity, --backdrop-opacity } | --tw-backdrop-opacity |
| backdrop-saturate | { --saturate, --backdrop-saturate } | --tw-backdrop-saturate |
| backdrop-sepia | { --sepia, --backdrop-septa } | --tw-backdrop-sepia |
| basis | { --container, --spacing, --flex-basis } | flex-basis |
| bg | { --color, --background-color } | background-color |
| bg | { --background-image } | background-image |
| blur | { --blur } | --tw-blur |
| border-spacing-x | { --spacing, --border-spacing } | --border-spacing-x |
| border-spacing-y | { --spacing, --border-spacing } | --border-spacing-y |
| border-spacing | { --spacing, --border-spacing } | --border-spacing-x; --border-spacing-y |
| border-width | { --border-width } | border-width |
| border | { --color, --border-color } | border-color |
| bottom | { --spacing, --inset } | bottom |
| brightness | { --brightness } | --tw-brightness |
| caret | { --color, --caret-color } | caret-color |
| col-end | { --grid-column-end } | grid-column-end |
| col-start | { --grid-column-start } | grid-column-start |
| columns | { --container, --columns } | columns |
| contrast | { --contrast } | --tw-contrast |
| delay | { --transition-delay } | transition-delay |
| divide-x | { --border-width, --divide-width } | --tw-divide-width |
| divide-y | { --border-width, --divide-width } | --tw-divide-width |
| drop-shadow | { --drop-shadow } | --tw-drop-shadow |
| duration | { --transition-duration } | transition-duration |
| ease | { --ease } | transition-timing-function |
| end | { --spacing, --inset } | inset-inline-end |
| fill | { --color, --fill } | fill |
| font | { --font } | font-family |
| font | { --font-weight } | font-weight |
| from | { --color, --background-color } | --tw-gradient-colors |
| from | { --gradient-color-stop-positions } | --tw-gradient-positions |
| grayscale | { --grayscale } | --tw-grayscale |
| h | { --spacing, --height } | height |
| hue-rotate | { --hue-rotate } | --tw-hue-rotate |
| inset-x | { --spacing, --inset } | inset-inline |
| inset-y | { --spacing, --inset } | inset-block |
| invert | { --invert } | --tw-invert |
| leading | { --leading } | line-height |
| left | { --spacing, --inset } | left |
| line-clamp | { --line-clamp } | line-clamp |
| m | { --spacing, --margin } | margin |
| max-h | { --spacing, --height, --max-height } | max-height |
| max-w | { --container, --spacing, --max-width } | max-width |
| mb | { --spacing, --margin } | margin-inline-bottom |
| me | { --spacing, --margin } | margin-inline-end |
| min-h | { --spacing, --height, --min-height } | min-height |
| min-w | { --container, --spacing, --min-width } | min-width |
| ml | { --spacing, --margin } | margin-inline-left |
| mr | { --spacing, --margin } | margin-inline-right |
| ms | { --spacing, --margin } | margin-inline-start |
| mt | { --spacing, --margin } | margin-inline-top |
| mx | { --spacing, --margin } | margin-inline |
| my | { --spacing, --margin } | margin-block |
| order | { --order } | order |
| outline-offset | { --outline-offset } | outline-offset |
| outline | { --color, --outline-color } | outline-color |
| p | { --spacing, --padding } | padding |
| pb | { --spacing, --padding } | padding-inline-bottom |
| pe | { --spacing, --padding } | padding-inline-end |
| pl | { --spacing, --padding } | padding-inline-left |
| pr | { --spacing, --padding } | padding-inline-right |
| ps | { --spacing, --padding } | padding-inline-start |
| pt | { --spacing, --padding } | padding-inline-top |
| px | { --spacing, --padding } | padding-inline |
| py | { --spacing, --padding } | padding-block |
| right | { --spacing, --inset } | right |
| ring | { --color, --ring-color } | --tw-ring-color |
| ring | { --ring-width } | --tw-ring-width |
| ring-offset | { --color, --ring-offset-color } | --tw-ring-offset-color |
| ring-offset | { --ring-offset-width } | --tw-ring-offset-width |
| rotate-x | { --rotate } | --tw-rotate-x |
| rotate-y | { --rotate } | --tw-rotate-y |
| rotate-z | { --rotate } | --tw-rotate-x |
| rotate | { --rotate } | rotate |
| rounded | { --radius } | border-radius |
| row-end | { --grid-row-end } | grid-row-end |
| row-start | { --grid-row-start } | grid-row-start |
| saturate | { --saturate } | --tw-saturate |
| scale-x | { --scale } | --tw-scale-x |
| scale-y | { --scale } | --tw-scale-y |
| scale-z | { --scale } | --tw-scale-x |
| scale | { --scale } | scale |
| sepia | { --septa } | --tw-sepia |
| shadow | { --shadow } | box-shadow |
| size | { --spacing, --size } | width; height |
| skew-x | { --skew } | --tw-skew-x |
| skew-y | { --skew } | --tw-skew-y |
| start | { --spacing, --inset } | inset-inline-start |
| stroke | { --color, --stroke } | stroke |
| stroke | { --stroke-width } | stroke-width |
| text-decoration | { --color, --text-decoration-color } | text-decoration-color |
| text | { --text--line-height } | line-height |
| text | { --text } | font-size |
| text | { --color, --text-color } | color |
| to | { --color, --background-color } | --tw-gradient-colors |
| to | { --gradient-color-stop-positions } | --tw-gradient-positions |
| top | { --spacing, --inset } | top |
| tracking | { --tracking } | letter-spacing |
| transition | { --transition-property } | transition-property |
| translate-x | { --spacing, --translate } | --translate-x |
| translate-y | { --spacing, --translate } | --translate-y |
| translate-z | { --spacing, --translate } | --translate-z |
| translate | { --spacing, --translate } | --translate-x; --translate-y |
| underline-offset | { --text-underline-offset } | outline-offset |
| w | { --container, --spacing, --width } | width |
| z | { --z-index } | z-index |