@theme — CSS directive that defines design tokens as CSS custom properties AND instructs Tailwind to generate matching utility classes/variants for them; the CSS-first replacement for tailwind.config.js. (Ch 13)
Theme namespace — the prefix of a @theme token (--color-*, --spacing, --breakpoint-*, --font-*, etc.) that determines which utility/variant family it generates. (Ch 13)
@utility / @custom-variant — directives for registering a brand-new utility class or a brand-new variant prefix directly in CSS, replacing v3's @layer utilities/config-based plugin system. (Ch 1, 6)
Arbitrary value / property / variant — square-bracket (bg-[#316ff6], [mask-type:luminance], [&:nth-child(3)]:) or parenthesis (bg-(--brand-color)) syntax for one-off values, CSS properties, or selectors with no built-in utility/variant. (Ch 1, 10)
Variant — a class prefix (hover:, md:, dark:, has-checked:, group-hover:, @container:) that conditionally applies a utility's styles; variants stack in any order and only ever apply their own condition. (Ch 11)
group / peer — marker classes that let a descendant (group-*) or a later sibling (peer-*) style itself based on the marked element's state; both support named variants (group/name, peer/name) for disambiguating nested cases. (Ch 11)
has-* — variant family styling an element based on its own descendants' state or content (has-checked:, has-[img]:); composes with group-/peer- prefixes. (Ch 11)
Container query — @container-scoped responsive styling (@sm:, @md:) that reacts to a parent element's size instead of the viewport; requires marking an ancestor @container. (Ch 9)
Preflight — Tailwind's opinionated base-style reset (built on modern-normalize), auto-injected into the base CSS layer; strips margins, normalizes borders/headings/lists, and can be disabled by omitting its import. (Ch 7)
--spacing — the single theme multiplier (default 0.25rem) that every numeric spacing/sizing utility (p-4, w-64, gap-2, ...) resolves against, instead of a fixed list of named steps. (Ch 13, 17, 18)
--container-* — the named-size scale (3xs 16rem → 7xl 80rem) shared by max-w-*, columns-*, basis-*, and container-query breakpoints (@sm…@7xl). (Ch 9, 15, 16, 18)
Composable CSS-variable utilities — the pattern behind filter, background-image (gradients), box-shadow, and transform sub-properties: each utility sets its own CSS variable, and the shared property references all of them, so multiple utilities combine instead of overwriting each other. (Ch 1, 21, 23, 24, 26)
@reference — imports a stylesheet for its theme/utility/variant definitions only (no output duplication), needed inside CSS Modules or Vue/Svelte/Astro <style> blocks to make @apply/@variant resolve custom tokens. (Ch 6)
-safe alignment suffix — appended to justify-*/items-*/content-*/self-* values (justify-center-safe) to fall back to start-alignment instead of clipping overflowing content. (Ch 16)
Logical properties — direction-aware utility variants (ms-*/me-* = inline-start/end, ps-*/pe-*, inset-s-*/inset-e-*) that adapt automatically to rtl:/ltr: instead of hardcoding physical left/right. (Ch 15, 17, 22)
dvh/svh/lvh (and dvw/svw/lvw) — dynamic/small/large viewport units used by sizing utilities (h-dvh, min-h-dvh) to handle mobile browser chrome correctly, unlike plain vh/screen. (Ch 18)
text-balance / text-pretty — text-wrap values for evening out headline line lengths (balance, browser-limited to short text) vs. avoiding orphans in full paragraphs (pretty). (Ch 20)
forced-color-adjust — controls whether an element opts out of OS-level forced-colors (Windows High Contrast) mode overriding its authored colors. (Ch 29)
Upgrade tool — npx @tailwindcss/upgrade, the automated v3→v4 migration CLI; handles most dependency, config, and template changes. (Ch 14)