Add support for Tailwind CSS class prefix configuration #118
ali-shabani
started this conversation in
Ideas
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Problem or use case
When working on projects that require namespaced or prefixed Tailwind CSS classes (e.g., tw-, ui-), there's currently no way to configure UntitledUI to generate components with these prefixes. This is a common requirement for:
Projects integrating multiple design systems
Avoiding class name conflicts with existing CSS
Meeting team/organization styling conventions
Working in micro-frontend architectures
Without this feature, developers must manually add prefixes to all Tailwind classes after component generation, which is time-consuming and error-prone.
Proposed solution
Add a configuration option (similar to shadcn/ui's prefix support) that allows users to specify a Tailwind class prefix. This could be implemented as:
A CLI flag: --prefix="tw-" during installation/add commands
A configuration file option in the UntitledUI config (e.g., tailwind.prefix in the config file)
Automatically detect and use the prefix from tailwind.config.js if one is defined there
When a prefix is configured, all generated components should automatically include it in their className attributes (e.g., className="flex items-center" becomes className="tw-flex tw-items-center").
Alternatives considered
No response
Examples or mockups
No response
Beta Was this translation helpful? Give feedback.
All reactions