Open
Description
Background
Currently, I'm exploring ways to disable the built-in utility classes in favor of using unocss
(or TailwindCSS via unocss
presets) in my project. I’ve found some related behavior:
- Fully disabling utility classes causes issues #18846
- Icons already support
unocss
via a preset, which is great!
Goal
In my project, I aim to:
- ✅ Use
unocss
instead of built-in utility classes wherever possible - ❌ Disable Vuetify utility classes selectively — only when safe
- 🧱 For unsafe cases, block them via
unocss
’sblocklist
Problem
Currently, I’m unclear on the compatibility boundaries between Vuetify utility classes and unocss
. Specifically:
- Which Vuetify utility classes are safe to disable?
- Which utility classes should be explicitly blocked in
unocss
to avoid conflicts?
Proposed Idea
Would it be possible to:
- Provide a Vuetify-compatible UnoCSS preset or config helper
- Or publish an official list of utility classes that:
- ✅ Can be safely replaced by
unocss
- 🧱 Should be included in a
blocklist
- ✅ Can be safely replaced by
This would greatly help in customizing and reducing conflicts when using unocss
in Vuetify-based projects.
Question
Has anyone already explored this direction?
Any recommended strategy or best practice for gradually migrating to unocss
with minimal friction?
Thanks in advance!
Metadata
Metadata
Assignees
Labels
No labels