Vize

CSS rules

Plain CSS in <style> blocks, including correctness and maintainability checks.

Each rule page shows a failing example, a passing example, and the configuration that turns the rule on.

Stricter presets (10)

Only in opinionated, nuxt or ecosystem. The Presets column lists which.

Rule What it checks Presets Auto-fix
css/no-display-none Suggest using v-show instead of display: none. opinionated, nuxt
css/no-hardcoded-values Suggest using CSS variables instead of hardcoded values. opinionated, nuxt
css/no-id-selectors Discourage use of ID selectors in CSS. opinionated, nuxt
css/no-important Discourage use of !important in CSS. opinionated, nuxt
css/no-utility-classes Warn against implementing utility classes in component styles. opinionated, nuxt
css/no-v-bind-performance Warn about performance cost of CSS v-bind(). opinionated, nuxt
css/prefer-logical-properties Recommend CSS logical properties for better i18n support. opinionated, nuxt
css/prefer-nested-selectors Recommend using CSS nesting for descendant selectors. opinionated, nuxt
css/prefer-slotted Recommend ::v-slotted() for styling slot content. opinionated, nuxt
css/require-font-display Require font-display in @font-face rules. opinionated, nuxt

Rules overview · Rule options · Migrating from ESLint