Skip to content
Nate
Stephens

Access the Theme in Arbitrary Values

It's possible to use the theme function within arbitrary values to reference the design tokens in your tailwind.config.js file.

<div class="grid grid-cols-[fit-content(theme(spacing.32))]">
  <!-- ... -->
</div>
<TopicsFilter
  currentTopic={topicParam}
  topics={postTopics}
  category={category}
  className="md:sticky md:top-[calc(theme(spacing.headerHeight)+3rem)] md:[grid-area:filter]"
/>

From the Tailwind CSS docs.


Last Updated: