Rules
There are over one hundred built-in rules to help you:
We turn on most of the rules in our standard config (✅) and many can be autofixed (🔧).
Avoid errors
You can avoid errors with these no
rules.
Descending
Disallow descending things with these no-descending
rules.
no-descending-specificity Disallow selectors of lower specificity from coming after overriding selectors of higher specificity. | ✅ |
Duplicate
Disallow duplicates with these no-duplicate
rules.
declaration-block-no-duplicate-custom-properties Disallow duplicate custom properties within declaration blocks. | ✅ | |
declaration-block-no-duplicate-properties Disallow duplicate properties within declaration blocks. | ✅ | 🔧 |
font-family-no-duplicate-names Disallow duplicate names within font families. | ✅ | 🔧 |
keyframe-block-no-duplicate-selectors Disallow duplicate selectors within keyframe blocks. | ✅ | |
no-duplicate-at-import-rules Disallow duplicate @import rules. | ✅ | |
no-duplicate-selectors Disallow duplicate selectors. | ✅ |
Empty
Disallow empty things with these no-empty
rules.
block-no-empty Disallow empty blocks. | ✅ | |
comment-no-empty Disallow empty comments. | ✅ | |
no-empty-source Disallow empty sources. | ✅ |
Invalid
Disallow invalid syntax with these (sometimes implicit) no-invalid
rules.
color-no-invalid-hex Disallow invalid hex colors. | ✅ | |
function-calc-no-unspaced-operator Disallow invalid unspaced operator within calc functions. | ✅ | 🔧 |
keyframe-declaration-no-important Disallow invalid !important within keyframe declarations. | ✅ | |
media-query-no-invalid Disallow invalid media queries. | ✅ | |
named-grid-areas-no-invalid Disallow invalid named grid areas. | ✅ | |
no-invalid-double-slash-comments Disallow invalid double-slash comments. | ✅ | |
no-invalid-position-at-import-rule Disallow invalid position @import rules. | ✅ | |
string-no-newline Disallow invalid newlines within strings. | ✅ |
Irregular
Disallow irregular things with these no-irregular
rules.
no-irregular-whitespace Disallow irregular whitespace. | ✅ |
Missing
Disallow missing things with these no-missing
rules.
custom-property-no-missing-var-function Disallow missing var function for custom properties. | ✅ | |
font-family-no-missing-generic-family-keyword Disallow a missing generic family keyword within font families. | ✅ |
Non-standard
Disallow non-standard things with these no-nonstandard
rules.
function-linear-gradient-no-nonstandard-direction Disallow non-standard direction values for linear gradient functions. | ✅ |
Overrides
Disallow overrides with these no-overrides
rules.
declaration-block-no-shorthand-property-overrides Disallow shorthand properties that override related longhand properties. | ✅ |
Unmatchable
Disallow unmatchable things with these no-unmatchable
rules.
selector-anb-no-unmatchable Disallow unmatchable An+B selectors. | ✅ |
Unknown
Disallow unknown things with these no-unknown
rules.
annotation-no-unknown Disallow unknown annotations. | ✅ | |
at-rule-no-unknown Disallow unknown at-rules. | ✅ | |
declaration-property-value-no-unknown Disallow unknown values for properties within declarations. | ||
function-no-unknown Disallow unknown functions. | ✅ | |
media-feature-name-no-unknown Disallow unknown media feature names. | ✅ | |
media-feature-name-value-no-unknown Disallow unknown values for media features. | ||
no-unknown-animations Disallow unknown animations. | ||
no-unknown-custom-media Disallow unknown custom media queries. | ||
no-unknown-custom-properties Disallow unknown custom properties. | ||
property-no-unknown Disallow unknown properties. | ✅ | |
selector-pseudo-class-no-unknown Disallow unknown pseudo-class selectors. | ✅ | |
selector-pseudo-element-no-unknown Disallow unknown pseudo-element selectors. | ✅ | |
selector-type-no-unknown Disallow unknown type selectors. | ✅ | |
unit-no-unknown Disallow unknown units. | ✅ |
Enforce conventions
You can enforce conventions with these no
and list
rules. They are powerful rules for making your code consistent. You'll need to configure most of them to suit your needs.
Allowed, disallowed & required
Allow, disallow or require things with these allowed-list
, disallowed-list
, required-list
and no
rules.
At-rule
at-rule-allowed-list Specify a list of allowed at-rules. | ||
at-rule-disallowed-list Specify a list of disallowed at-rules. | ||
at-rule-no-vendor-prefix Disallow vendor prefixes for at-rules. | ✅ | 🔧 |
at-rule-property-required-list Specify a list of required properties for an at-rule. |
Color
color-hex-alpha Require or disallow alpha channel for hex colors. | ||
color-named Require (where possible) or disallow named colors. | ||
color-no-hex Disallow hex colors. |
Comment
comment-word-disallowed-list Specify a list of disallowed words within comments. |
Declaration
declaration-no-important Disallow !important within declarations. | ||
declaration-property-unit-allowed-list Specify a list of allowed property and unit pairs within declarations. | ||
declaration-property-unit-disallowed-list Specify a list of disallowed property and unit pairs within declarations. | ||
declaration-property-value-allowed-list Specify a list of allowed property and value pairs within declarations. | ||
declaration-property-value-disallowed-list Specify a list of disallowed property and value pairs within declarations. |
Function
function-allowed-list Specify a list of allowed functions. | ||
function-disallowed-list Specify a list of disallowed functions. | ||
function-url-no-scheme-relative Disallow scheme-relative URLs. | ||
function-url-scheme-allowed-list Specify a list of allowed URL schemes. | ||
function-url-scheme-disallowed-list Specify a list of disallowed URL schemes. |
Length
length-zero-no-unit Disallow units for zero lengths. | ✅ | 🔧 |