Tailwind theme variable namespaces (v4.1.13)

theme-variable-namespaces-table.md

Namespace	Utility classes
--accent-color-*	Accent color utilities like accent-blue-600
--animate-*	Animation utilities like animate-spin
--aspect-*	Aspect ratio utilities like aspect-video
--backdrop-blur-*	Backdrop blur utilities like backdrop-blur-md
--backdrop-brightness-*	Backdrop brightness utilities like backdrop-brightness-125
--backdrop-contrast-*	Backdrop contrast utilities like backdrop-contrast-125
--backdrop-grayscale-*	Backdrop grayscale utilities like backdrop-grayscale
--backdrop-hue-rotate-*	Backdrop hue rotate utilities like backdrop-hue-rotate-60
--backdrop-invert-*	Backdrop invert utilities like backdrop-invert
--backdrop-opacity-*	Backdrop opacity utilities like backdrop-opacity-50
--backdrop-saturate-*	Backdrop saturate utilities like backdrop-saturate-150
--backdrop-sepia-*	Backdrop sepia utilities like backdrop-sepia
--background-color-*	Background color utilities like bg-zinc-800
--background-image-*	Background image/gradient utilities like bg-[url('/img.png')] and bg-gradient-to-r
--blur-*	Blur filter utilities like blur-md
--border-color-*	Border color utilities like border-slate-300
--border-spacing-*	Table border-spacing utilities like border-spacing-4 and border-spacing-x-8
--border-width-*	Border width utilities like border, border-2, border-x
--box-shadow-color-*	Shadow color utilities like shadow-red-500
--breakpoint-*	Responsive breakpoint variants like sm:*
--brightness-*	Brightness filter utilities like brightness-110
--caret-color-*	Caret color utilities like caret-rose-500
--color-*	Color utilities like bg-red-500, text-sky-300, and many more
--columns-*	CSS multi‑column utilities like columns-3 and columns-auto
--container-*	Container query variants like @sm:* and size utilities like max-w-md
--contrast-*	Contrast filter utilities like contrast-125
--cursor-*	Cursor utilities like cursor-pointer and cursor-not-allowed
--divide-color-*	Divider color utilities like divide-gray-200
--divide-width-*	Divider width utilities like divide-x-2 and divide-y
--drop-shadow-*	Drop shadow filter utilities like drop-shadow-md
--drop-shadow-color-*	Drop shadow color utilities like drop-shadow-red-500
--ease-*	Transition timing function utilities like ease-out
--fill-*	SVG fill color utilities like fill-blue-500
--flex-basis-*	Flex basis utilities like basis-1/2 and basis-40
--font-*	Font family utilities like font-sans
--font-feature-settings-*	Advanced font feature utilities via text-[font-feature-settings:'ss01']
--font-variation-settings-*	Variable font axis utilities via text-[font-variation-settings:'wght'_600]
--font-weight-*	Font weight utilities like font-bold
--gap-*	Gap utilities like gap-4, gap-x-2, and gap-y-8
--gradient-color-stop-positions-*	Gradient stop position utilities like from-10%, via-[35%], and to-90%
--grayscale-*	Grayscale filter utilities like grayscale and grayscale-0
--grid-auto-columns-*	Auto columns utilities like auto-cols-fr and auto-cols-min
--grid-auto-rows-*	Auto rows utilities like auto-rows-min and auto-rows-fr
--grid-column-*	Grid column shorthand utilities like col-auto or col-[2/4]
--grid-column-end-*	Column end utilities like col-end-7
--grid-column-start-*	Column start utilities like col-start-3
--grid-row-*	Grid row shorthand utilities like row-auto or row-[2/5]
--grid-row-end-*	Row end utilities like row-end-4
--grid-row-start-*	Row start utilities like row-start-2
--grid-template-columns-*	Grid template columns utilities like grid-cols-12
--grid-template-rows-*	Grid template rows utilities like grid-rows-6
--height-*	Height utilities like h-64 and h-screen
--hue-rotate-*	Hue rotate filter utilities like hue-rotate-60
--inset-shadow-*	Inset box shadow utilities like inset-shadow-xs
--invert-*	Invert filter utilities like invert and invert-0
--leading-*	Line height utilities like leading-tight
--letter-spacing-*	Used internally by composite text-* sizes; prefer tracking-* for utilities
--line-clamp-*	Line clamping utilities like line-clamp-3 and line-clamp-none
--line-height-*	Used internally by composite text-* sizes; prefer leading-* for utilities
--margin-*	Margin utilities like mt-6, mx-auto, and -mb-2
--max-height-*	Max-height utilities like max-h-96 and max-h-none
--max-width-*	Max-width utilities like max-w-md and max-w-none
--min-height-*	Min-height utilities like min-h-0 and min-h-screen
--min-width-*	Min-width utilities like min-w-0 and min-w-full
--object-position-*	Object position utilities like object-center and object-top-left
--opacity-*	Opacity utilities like opacity-60
--order-*	Flex/grid order utilities like order-3, order-first, and order-last
--outline-color-*	Outline color utilities like outline-sky-500
--outline-offset-*	Outline offset utilities like outline-offset-4
--outline-width-*	Outline width utilities like outline-2
--padding-*	Padding utilities like px-4, pt-2, and p-6
--perspective-*	Perspective utilities like perspective-near
--perspective-origin-*	Perspective origin utilities like perspective-origin-top-left
--radius-*	Border radius utilities like rounded-sm
--ring-color-*	Ring color utilities like ring-indigo-500
--ring-offset-color-*	Ring offset color utilities like ring-offset-white
--ring-offset-width-*	Ring offset width utilities like ring-offset-2
--ring-width-*	Ring width utilities like ring and ring-2
--rotate-*	Rotate utilities like rotate-45 and -rotate-12
--saturate-*	Saturate filter utilities like saturate-150
--scale-*	Scale utilities like scale-95 and scale-x-110
--scroll-margin-*	Scroll margin utilities like scroll-mt-16 and scroll-my-8
--scroll-padding-*	Scroll padding utilities like scroll-px-4 and scroll-py-8
--sepia-*	Sepia filter utilities like sepia and sepia-0
--shadow-*	Box shadow utilities like shadow-md
--size-*	Square sizing utilities like size-12 (sets width & height)
--skew-*	Skew utilities like skew-x-6 and skew-y-3
--space-*	Space-between utilities like space-x-2 and space-y-4
--spacing-*	Spacing and sizing utilities like px-4, max-h-16, and many more
--stroke-*	SVG stroke color utilities like stroke-red-500
--stroke-width-*	SVG stroke width utilities like stroke-2
--tab-size-*	Tab size utilities like tab-size-4
--text-*	Font size utilities like text-xl
--text-color-*	Text color utilities like text-emerald-500
--text-decoration-color-*	Decoration color utilities like decoration-pink-500
--text-decoration-thickness-*	Decoration thickness utilities like decoration-2 and decoration-from-font
--text-indent-*	Text indent utilities like indent-4
--text-shadow-*	Text shadow utilities like text-shadow-md
--text-shadow-color-*	Text shadow color utilities like text-shadow-red-500
--text-underline-offset-*	Underline offset utilities like underline-offset-4 and underline-offset-auto
--tracking-*	Letter spacing utilities like tracking-wide
--transform-origin-*	Transform origin utilities like origin-top-left
--transition-delay-*	Transition delay utilities like delay-150
--transition-duration-*	Transition duration utilities like duration-300
--transition-property-*	Transition property utilities like transition, transition-colors, and transition-[...]
--translate-*	Translate utilities like translate-x-1/2 and -translate-y-4
--width-*	Width utilities like w-1/2 and w-64
--z-index-*	Z-index utilities like z-50 and z-auto