css-tailwind-theme-pipeline

Resolve Tailwind CSS and MUI font family conflicts by consolidating typography tokens into a single canonical theme source file, ensuring both systems reference identical font families without overriding each other.

Duplicate Tailwind CSS theme blocks typically occur when multiple `@import 'tailwindcss'` instances are loaded across different project files. Consolidating these imports into a single pipeline entry point eliminates the duplication and ensures a unified theme cascade.

To configure Tailwind CSS for Untitled UI primitives, include `@source` with the `packages/ui/src/**/*.{ts,tsx}` glob pattern in your global theme file. This ensures Tailwind scans and generates the necessary utility classes for primitive components.

You can use MUI and Tailwind CSS together by structuring a unified global CSS architecture. This approach manages theme consistency and prevents style conflicts by ensuring both frameworks draw from a single canonical theme configuration.

A canonical theme source in Tailwind CSS is a single `@theme` declaration block located in a central CSS file. It serves as the authoritative source for design tokens, preventing scattered configurations and ensuring consistent styling across the entire application.