[v4] Docs for transition-property CSS variable (Or maybe others too?)

[oliver139]

I used to use v3 before, which use js to extend property like:

export default {
  extend: {
    transitionDuration: {
      DEFAULT: '300ms',
    },
    transitionProperty: {
      font: 'color, font-size, font-weight, text-align',
      opacity: 'opacity, visibility',
      'hidden-rows': 'opacity, visibility, grid-template-rows',
    },
  },
}

According to transition-property, I found that I can override the default value of transition-duration with variable --default-transition-duration, although it is quite hidden I think.

But how about transition-property? AI tells that I can do by:

@theme {
  --transition-property-font: color, font-size, font-weight, text-align;
  --transition-property-opacity: opacity, visibility;
  --transition-property-hidden-rows: opacity, visibility, grid-template-rows;
}

Where the info is from #16639 and I can't find anywhere from the official docs..
May I know where is this?

[wongjn]

Some theme namespaces are purposefully left out of the docs.

tailwindlabs/tailwindcss.com#2178 (comment):

Hey! I was looking into this today and prepared an exhaustive list but the full list ends up being extremely long and not really useful so for now we're not going to make changes to the website. I did, however, use my research and upload it to a GitHub Gist so here's the definitive version as of Tailwind CSS v4.1: https://gist.github.com/philipp-spiess/83101e0d0fce4d70fa080dbf31560894

[oliver139]

Awesome! This is very useful, thanks!