Skip to guide content
Developer Export And Workflows Guide and tutorial

How to export Tailwind and Shadcn files

Use palette exports as Tailwind config and Shadcn-ready CSS variables.

1 min read190 wordsUpdated May 20, 2026

What the export includes

The Tailwind and Shadcn export includes project-ready files such as a Tailwind configuration, global CSS variables, and a README. These files help move palette colors into a frontend project faster.

Tailwind config

The Tailwind configuration exposes palette colors so they can be used through utility classes. This is useful when you want consistent colors for backgrounds, borders, text, rings, cards, and component states.

Shadcn-style variables

The global CSS file maps colors into theme variables used by component systems. These variables usually represent roles such as background, foreground, primary, secondary, accent, border, and muted surfaces.

Light and dark themes

The export can include light and dark variable sets. Review both modes before using them in production, because a color that looks strong in one mode may need adjustment in the other.

Start by importing the files into a test branch or prototype. Check buttons, cards, forms, dialogs, navigation, and disabled states. After the palette feels stable, replace raw color names with semantic names that match your product language.


Top tools

BoardlyLinksyChromoCodeHub

ReadyTools

CareersContactTools
Pricing7 days free
GuidesDocsBlogUpdatesLaraVault

Select Language

Set theme

© 2026 ReadyTools. All rights reserved.