Stylelint plugin to add rule no-indistinguishable-colors

Usage no npm install needed!

<script type="module">
  import adpPsychStylelintNoIndistinguishableColors from 'https://cdn.skypack.dev/@adp-psych/stylelint-no-indistinguishable-colors';



Travis NPM Version

Stylelint plugin that disallows colors that are suspiciously close to being identical, using css-colorguard.


npm install --save-dev stylelint stylelint-no-indistinguishable-colors


Update your Stylelint config with following rules:

  "plugins": [
  "rules": {
    "plugin/stylelint-no-indistinguishable-colors": true


Boolean, or an array of options, where the first element is true, and the second is an options object.

Boolean option

true: Enables the plugin. Defaults to Colorguard's threshold of 3.

false: Disables the plugin.

Optional secondary options

Corresponds to Colorguard options object.

ignore: Array ['#colorA', '#colorB']

Hex color codes that you would like to ignore completely.

threshold: Number

Number can be between 0 and 100. The default value is 3.

The lower the threshold the more similar the colors have to be to trigger a violation. The higher the threshold, the more violations you will get.

whitelist: Array [['#colorA', '#colorB'], ['#colorC', '#colorD']]

An array of color pairs to ignore.

allowEquivalentNotation: Boolean

By default, colorguard will complain if identical colors are represented with different notations. For example, #000, #000000, rgba(0, 0, 0, 0), and black. If you want to permit these equivalent notations, set this option to true.