Tailwind CSS
Mon
Wed
Fri
JunJulAugSepOctNovDecJanFebMarAprMayJun
LessMore
Releases5Avg2/moVersionsv4.2.2 to v4.3.1
Last Checked
20h ago
All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
--silent option to suppress output in @tailwindcss/cli (#20100)Module#registerHooks instead of Module#register on Node 26+ (#20028)@apply to be used with CSS mixins (#19427)not-* correctly negates @container queries, including style(…) queries (#20059)drop-shadow-* color utilities work with custom shadow values containing calc(…) (#20080)@tailwindcss/vite (#20103)@tailwindcss/webpack can be installed in Rspack projects without requiring webpack as a peer dependency (#20027)calc(…) expressions (e.g. px-[calc(1rem+0px)] → px-[calc(1rem+0)]) (#20127)left-[99999px] → left-[99999px], not left-24999.75) (#20130)@tailwindcss/cli in --watch mode recovers when a tracked dependency is deleted and restored (#20137)@tailwindcss/cli binaries are ignored when scanning for class candidates (#20139)addClass(…) and removeClass(…) calls (#20198)@variant to be used inside addBase (#19480)@source globs with symlinks are preserved (#20203)@source rules can re-include files excluded by earlier @source not rules (#20203)@utility rules (#20205)inset-shadow-none and other inset shadows work correctly (#20208)@source directories are scanned even when ignored by git (#20214)@source globs ending in **/* preserve dynamic path segments to avoid scanning too many files (#20217)calc(…) divisions when the result would require high precision (e.g. w-[calc(100%/3.5)] → w-[calc(100%/3.5)], not w-[28.571428571428573%]) (#20221)@tailwindcss/postcss (#20228)0 instead of calc(var(--spacing) * 0) for spacing utilities like m-0 and left-0 (#20196)var(--spacing) instead of calc(var(--spacing) * 1) for spacing utilities like m-1 and left-1 (#20196)@container-size utility (#18901)scrollbar-{auto,thin,none} utilities for scrollbar-width, and scrollbar-thumb-* / scrollbar-track-* color utilities for scrollbar-color (#19981, #20019)scrollbar-gutter-* utilities (#20018)zoom-* utilities (#20020)tab-* utilities (#20022)@variant with stacked variants (e.g. @variant hover:focus { … }) (#19996)@variant with compound variants (e.g. @variant hover, focus { … }) (#19996)--default(…) in --value(…) and --modifier(…) for functional @utility definitions (#19989)@plugin resolves package JavaScript entries instead of browser CSS entries when using @tailwindcss/vite (#19949)@import and @plugin paths resolving from the wrong directory when using @tailwindcss/vite (#19965)@variant are processed by @tailwindcss/vite (#19966)base when result.opts.from is not provided when using @tailwindcss/postcss (#19980)_ whitespace in arbitrary values (#19986)w-[calc(100%---spacing(60))] → w-[calc(100%-(--spacing(60)))]) (#19986)-mt-[20in] → mt-[-20in], not mt-[-1920px]) (#19988):has() variants from [&:has(…)] to has-[…] (#19991)style attributes (e.g. style="flex-grow: 1" → style="flex-grow: 1", not style="grow: 1") (#19918)@utility definitions with the same name but different value types (#19777)PluginWithConfig type from tailwindcss/plugin to fix errors when inferring plugin config types (#19707)start and end legacy utilities without values do not generate CSS (#20003)--value(…) is required in functional @utility definitions (#20005)-left-[(var(--a)+var(--b))]) (#20011)@import and @plugin still resolve correctly when using Vite aliases in @tailwindcss/vite (#19947)tracking-* utilities by preferring non-negative utilities (e.g. -tracking-tighter → tracking-wider) (#19827)@tailwindcss/webpack (#19723)px-[1.2rem] py-[1.2rem] → p-[1.2rem]) (#19837)border-{t,b}-* into border-y-*, border-{l,r}-* into border-x-*, and border-{t,r,b,l}-* into border-* (#19842)scroll-m{t,b}-* into scroll-my-*, scroll-m{l,r}-* into scroll-mx-*, and scroll-m{t,r,b,l}-* into scroll-m-* (#19842)scroll-p{t,b}-* into scroll-py-*, scroll-p{l,r}-* into scroll-px-*, and scroll-p{t,r,b,l}-* into scroll-p-* (#19842)overflow-{x,y}-* into overflow-* (#19842)overscroll-{x,y}-* into overscroll-* (#19842)--placeholder-color instead of --background-color for placeholder-* utilities (#19843)config.content when migrating from Tailwind CSS v3 to Tailwind CSS v4 (#19846).env and .env.* to default ignored content files (#19846)overflow-ellipsis into text-ellipsis (#19849)start-full → inset-s-full, start-auto → inset-s-auto, start-px → inset-s-px, and start-<number> → inset-s-<number> as well as negative versions (#19849)end-full → inset-e-full, end-auto → inset-e-auto, end-px → inset-e-px, and end-<number> → inset-e-<number> as well as negative versions (#19849)- sign inside the arbitrary value -left-[9rem] → left-[-9rem] (#19858)- sign outside the arbitrary value ml-[calc(-1*var(--width))] → -ml-(--width) (#19858)NODE_PATH environment variable in standalone CLI (#19617)row-constructor (#19725)calc(var(--spacing)*…) expressions into --spacing(…) (#19769)@property at-rules (e.g. shadow-sm border) (#19727)@tailwindcss/vite (#19745)@tailwindcss/vite (#19790)w-1234 h-1234 → size-1234) (#19809)w-5 h-5 size-5 → '' instead of size-5) (#19812)@import '@/path/to/file'; when using @tailwindcss/vite (#19803). characters within curly braces in MDX files (#19711)@tailwindcss/webpack package to run Tailwind CSS as a webpack plugin (#19610)pbs-* and pbe-* utilities for padding-block-start and padding-block-end (#19601)mbs-* and mbe-* utilities for margin-block-start and margin-block-end (#19601)scroll-pbs-* and scroll-pbe-* utilities for scroll-padding-block-start and scroll-padding-block-end (#19601)scroll-mbs-* and scroll-mbe-* utilities for scroll-margin-block-start and scroll-margin-block-end (#19601)border-bs-* and border-be-* utilities for border-block-start and border-block-end (#19601)inline-*, min-inline-*, max-inline-* utilities for inline-size, min-inline-size, and max-inline-size (#19612)block-*, min-block-*, max-block-* utilities for block-size, min-block-size, and max-block-size (#19612)inset-s-*, inset-e-*, inset-bs-*, inset-be-* utilities for inset-inline-start, inset-inline-end, inset-block-start, and inset-block-end (#19613)font-features-* utility for font-feature-settings (#19623)@supports wrapper for color-mix values (#19450)@source inline() argument (#19461)@tailwindcss/cli (#19447)@utility name validation with Oxide scanner rules (#19524)@variant inside @custom-variant (#19633).25 in aspect-* fractions (e.g. aspect-8.5/11) (#19688)@source trigger a full page reload when using @tailwindcss/vite (#19670)@tailwindcss/vite (#19677)@utility names to improve support with formatters such as Biome (#19626).jj to default ignored content directories (#19687)start-* and end-* utilities in favor of inset-s-* and inset-e-* utilities (#19613)source(…) happens relative to the file it is in (#19274)! in the value (#19243)@tailwindcss/vite (#18970)--watch (#19373)ringColor.DEFAULT) in JS configs (#19348)content theme key from JS configs (#19381)future and experimental config keys (#19344)text-* and leading-* classes (#19396)@keyframes (#19419)/dev/stdout (#19421)sibling-*() functions when used inside calc(…) (#19335)@variant inside legacy JS APIs (#19263)& (#19184)& > :pseudo and & :pseudo arbitrary variants (#19178)color-mix fallback (#19069):deep, :slotted, and :global (#19094)not-*, has-*, and in-* (#19100)theme(…) function (#19111)\t is used in at-rules (#19130)0 values (#19095)break-words to wrap-break-word (#19157)postinstall script from oxide ([#19149])(https://github.com/tailwindlabs/tailwindcss/pull/19149)' syntax in ClojureScript when extracting classes (#18888)@variant inside @custom-variant (#18885)@utility (#18900)grid-column utilities when configuring grid-column-start or grid-column-end (#18907)grid-row utilities when configuring grid-row-start or grid-row-end (#18907)default export condition for @tailwindcss/vite (#18948)@theme produce no output when built (#18979)variant = 'outline' during upgrades (#18922)className is migrated (#19031)*ClassName and *Class attributes (#19031)supports-[…] queries in arbitrary values (#13605)require.cache error when loaded through a TypeScript file in Node 22.18+ (#18665)import.meta.resolve(…) in configs for new enough Node.js versions (#18938)postcss-load-config for better ESM and TypeScript PostCSS config support with the CLI (#18938)visibility when using transition (#18795)matchVariant values (#18798)clip with clip-path in sr-only (#18769)matchUtilities (#18820).vercel folders by default (can be overridden by @source … rules) (#18855)@- to be invalid (e.g. @-2xl:flex) (#18869)- or _ (#18867, #18872)aria theme keys to @custom-variant (#18815)data theme keys to @custom-variant (#18816)supports theme keys to @custom-variant (#18817)@apply (#18404)flex-<number> utilities (#18642)) from interfering with extraction in Clojure keywords (#18345)@plugin and @config (#18345)process.env.DEBUG in @tailwindcss/node (#18485)false or undefined properties (#18571)@tailwindcss/postcss via transformAssetUrls: false (#18321)addEventListener and JavaScript variable names (#18718)--border-color-* theme keys in divide-* utilities for backwards compatibility (#18704).hdr and .exr files for classes by default (#18734)emit(…) (#18330)--watch=always in the CLI's usage (#18337)@tailwindcss/vite (#18384)w-[calc(100%-var(--offset))]) (#18289)/[0.16] → /16) (#18184)mb-[-32rem] → -mb-128) (#18212)blur in wire:model.blur (#18216)@apply fails (#18059)<style> blocks (#18057, 18068)tailwindcss in pnpm monorepos (#18065)order-none to order-0 (#18126)class: attributes when extracting classes (#18093)-mt-[0px] to mt-[0px] instead of the other way around (#18154)\n at the end of the file (#18155).pnpm-store folders by default (can be overridden by @source … rules) (#18163)toJSON() (#18083)_ before numbers during candidate extraction (#17961)@theme and @utility together (#17675)::before and ::after pseudo selectors create valid CSS rules in production builds (#17979)-rotate-* utilities properly negate arbitrary values (#18014):merge(…) selectors in legacy JS plugins (#18020). are properly extracted from Clojure files (#18038)@import … source(…) (#17963)class (#18025)h-[1lh] to h-lh) (#17831, #17854)@source directives, discovered files and scanned files when using DEBUG=* (#17906, #17952)scale values generate negative values (#17831)@reference (#17836)_ with in arbitrary modifier shorthand bg-red-500/(--my_opacity) (#17889).log files for classes by default (#17906)@apply rules (#17925)optionalDependencies are skipped (#17929)@tailwindcss/upgrade to upgrade between versions of v4.* (#17717)h-lh / min-h-lh / max-h-lh utilities (#17790)display, visibility, content-visibility, overlay, and pointer-events when using transition to simplify @starting-style usage (#17812).geojson or .db files for classes by default (#17700, #17711)_ with . in theme suggestions for @utility if surrounded by digits (#17733)color-mix(…) when opacity is 100% (#17815)- to variants starting with @ (#17814).hg, .svn, .venv, venv, .yarn, .next, .turbo, .parcel-cache, __pycache__, and .svelte-kit folders by default (can be overridden by @source … rules) (#17892)@source rules that point inside .hg, .svn, .venv, venv, .yarn, .next, .turbo, .parcel-cache, __pycache__, and .svelte-kit folders no longer consider your .gitignore rules (#17892)@tailwindcss/oxide-wasm32-wasi target for running Tailwind in browser environments like StackBlitz (#17558)color-mix(…) polyfills do not cause used CSS variables to be removed (#17555)color-mix(…) polyfills create fallbacks for theme variables that reference other theme variables (#17562){10..0..5} and {0..10..-5} (#17591)skew-* utilities (#17627)shadow-inherit, inset-shadow-inherit, drop-shadow-inherit, and text-shadow-inherit inherit the shadow color (#17647)fontSize JS theme keys (#17630)fontSize array tuple syntax to CSS theme variables (#17630)