UNPKG

2 kBMarkdownView Raw
1# color-named
2
3Require (where possible) or disallow named colors.
4
5```css
6a { color: black }
7/** ↑
8 * This named color */
9```
10
11## Options
12
13`string`: `"always-where-possible"|"never"`
14
15### `"always-where-possible"`
16
17Colors *must always*, where possible, be named.
18
19This will complain if a hex (3, 4, 6 and 8 digit), `rgb()`, `rgba()`, `hsl()`, `hsla()`, `hwb()` or `gray()` color can be represented as a named color.
20
21The following patterns are considered violations:
22
23```css
24a { color: #000; }
25```
26
27```css
28a { color: #f000; }
29```
30
31```css
32a { color: #ff000000; }
33```
34
35```css
36a { color: rgb(0, 0, 0); }
37```
38
39```css
40a { color: rgb(0%, 0%, 0%); }
41```
42
43```css
44a { color: rgba(0, 0, 0, 0); }
45```
46
47```css
48a { color: hsl(0, 0%, 0%); }
49```
50
51```css
52a { color: hwb(0, 0%, 100%); }
53```
54
55```css
56a { color: gray(0); }
57```
58
59The following patterns are *not* considered violations:
60
61```css
62a { color: black; }
63```
64
65```css
66a { color: rgb(10, 0, 0); }
67```
68
69```css
70a { color: rgb(0, 0, 0, 0.5); }
71```
72
73### `"never"`
74
75Colors *must never* be named.
76
77The following patterns are considered violations:
78
79```css
80a { color: black; }
81```
82
83```css
84a { color: white; }
85```
86
87The following patterns are *not* considered violations:
88
89```css
90a { color: #000; }
91```
92
93```css
94a { color: rgb(0, 0, 0); }
95```
96
97```css
98a { color: var(--white); }
99```
100
101```scss
102a { color: $blue; }
103```
104
105```less
106a { color: @blue; }
107```
108
109## Optional secondary options
110
111### `ignore: ["inside-function"]`
112
113Ignore colors that are inside a function.
114
115For example, with `"never"`.
116
117The following patterns are *not* considered violations:
118
119```css
120a {
121 color: map-get($colour, blue);
122}
123```
124
125```css
126a {
127 background-image: url(red);
128}
129```
130
131### `ignoreProperties: ["/regex/", /regex/, "string"]`
132
133For example with `"never"`.
134
135Given:
136
137```js
138["/^my-/", "composes"]
139```
140
141The following patterns are *not* considered violations:
142
143```css
144a {
145 my-property: red;
146}
147```
148
149```css
150a {
151 my-other-property: red;
152}
153```
154
155```css
156a {
157 composes: red from './index.css';
158}
159```