The theme() function from the Tailwind config is not expanded in arbitrary values

[Serator]

What version of Tailwind CSS are you using?

3.4.14

Reproduction URL

https://play.tailwindcss.com/jhNKe63ed5

Describe your issue

tailwind.config.js

module.exports = {
  theme: {
    boxShadow: {
      base: '0 0 0 theme(spacing.2) green inset',
    },
  },
}

HTML

<div class="[box-shadow:_theme(boxShadow.base)]">❌</div>

<div class="shadow-base">✅</div>

The theme() function does not expand to its actual value when an arbitrary property is used with theme().

[philipp-spiess]

Thanks for the report! Agree that this is unexpected but due to our efforts currently on Tailwind v4, I don't think this is a fix that we will backport to v3 I’m afraid. You can see that this already works in v4: https://play.tailwindcss.com/7nTSpkZLEs

We'll have more to share about v4 very soon, though. Let me keep this open so I remember I share some more details with you soon and hopefully you can help us test v4 with your project!

[Serator]

Got it, thanks. I think it's wise to direct efforts towards a future version. It looks pretty impressive! 👍🏻