http://www.cssstats.com/#/site/url/https%253A%252F%252Fmarketplace.firefox.com 109 color definitions! (dupes counted)

https://github.com/SlexAxton/css-colorguard would help immensely will this

There are now 146 colours! We should remove unused colours (bug 1090033). More importantly, we should have everything using the same shades instead of making one-offs for a particular shade of gray here and there. As mentioned in comment 1, css-colorguard works quite well for this. –– > % for f (**/*.styl.css) { echo '\n\n===' $f '===\n' && colorguard --file $f } > > > === src/media/css/account.styl.css === > > Collision: #ffffff, #f1f1f1 > - #fff (#ffffff) [line: 9, 24, 27, 41, 42, 43, 64, 68, 69, 70, 131, 176] is too close (2.8384025881055353) to #f1f1f1 (#f1f1f1) [line: 24] > Collision: #f1f1f1, #e7e7e7 > - #f1f1f1 (#f1f1f1) [line: 24] is too close (2.124714558904567) to #e7e7e7 (#e7e7e7) [line: 27, 40, 41, 42, 43, 64, 67, 68, 69, 70, 111] > Collision: #cccccc, #c7c7c7 > - #ccc (#cccccc) [line: 26] is too close (1.2328610597909233) to #c7c7c7 (#c7c7c7) [line: 63, 155, 187] > Collision: #cccccc, #d7d7d7 > - #ccc (#cccccc) [line: 26] is too close (2.6149618265228445) to #d7d7d7 (#d7d7d7) [line: 98, 103, 132] > > > === src/media/css/app-list.styl.css === > > There are no collisions. > > > === src/media/css/buttons.styl.css === > > There are no collisions. > > > === src/media/css/categories.styl.css === > > Collision: #eeeeee, #fcfcfc > - #eee (#eeeeee) [line: 13] is too close (2.8712928654793726) to #fcfcfc (#fcfcfc) [line: 80] > Collision: #ffffff, #fcfcfc > - #fff (#ffffff) [line: 57] is too close (0.5956745296239889) to #fcfcfc (#fcfcfc) [line: 80] > > > === src/media/css/category-dropdown-desktop.styl.css === > > Collision: #cccccc, #c7c7c7 > - #ccc (#cccccc) [line: 43, 44] is too close (1.2328610597909233) to #c7c7c7 (#c7c7c7) [line: 91] > > > === src/media/css/category-icons.styl.css === > > There are no collisions. > > > === src/media/css/collections.styl.css === > > Collision: #ffffff, #f1f1f1 > - rgba(255,255,255,0.25) (#ffffff) [line: 38, 47, 50] is too close (2.8384025881055353) to #f1f1f1 (#f1f1f1) [line: 43, 51] > > > === src/media/css/compat-filtering.styl.css === > > There are no collisions. > > > === src/media/css/detail-content-ratings.styl.css === > > There are no collisions. > > > === src/media/css/detail.styl.css === > > Collision: #ffffff, #f1f1f1 > - #fff (#ffffff) [line: 9, 20, 49, 49, 50, 50, 114, 154, 201, 202, 203] is too close (2.8384025881055353) to #f1f1f1 (#f1f1f1) [line: 110] > Collision: #c7c7c7, #cccccc > - #c7c7c7 (#c7c7c7) [line: 11] is too close (1.2328610597909233) to #ccc (#cccccc) [line: 33] > Collision: #c7c7c7, #d0d0d0 > - #c7c7c7 (#c7c7c7) [line: 11] is too close (2.1987268353004232) to #d0d0d0 (#d0d0d0) [line: 124] > Collision: #eeeeee, #f1f1f1 > - #eee (#eeeeee) [line: 32] is too close (0.6285798809399238) to #f1f1f1 (#f1f1f1) [line: 110] > Collision: #eeeeee, #e1e1e1 > - #eee (#eeeeee) [line: 32] is too close (2.81291139667348) to #e1e1e1 (#e1e1e1) [line: 200, 201, 202, 203] > Collision: #cccccc, #d7d7d7 > - #ccc (#cccccc) [line: 33] is too close (2.6149618265228445) to #d7d7d7 (#d7d7d7) [line: 59, 111, 116] > Collision: #cccccc, #d0d0d0 > - #ccc (#cccccc) [line: 33] is too close (0.9660199281725556) to #d0d0d0 (#d0d0d0) [line: 124] > Collision: #d7d7d7, #d0d0d0 > - #d7d7d7 (#d7d7d7) [line: 59, 111, 116] is too close (1.6491857990212937) to #d0d0d0 (#d0d0d0) [line: 124] > Collision: #d7d7d7, #e1e1e1 > - #d7d7d7 (#d7d7d7) [line: 59, 111, 116] is too close (2.2702315878032837) to #e1e1e1 (#e1e1e1) [line: 200, 201, 202, 203] > > > === src/media/css/error-screens.styl.css === > > There are no collisions. > > > === src/media/css/feed.styl.css === > > Collision: #5bbaff, #4cb1ff > - #5bbaff (#5bbaff) [line: 170, 171, 189] is too close (2.677725027581818) to #4cb1ff (#4cb1ff) [line: 309, 378, 403] > > > === src/media/css/feedback.styl.css === > > There are no collisions. > > > === src/media/css/form-modal.styl.css === > > There are no collisions. > > > === src/media/css/forms.styl.css === > > There are no collisions. > > > === src/media/css/header.styl.css === > > Collision: #ffffff, #f1f1f1 > - #fff (#ffffff) [line: 5, 144] is too close (2.8384025881055353) to #f1f1f1 (#f1f1f1) [line: 6, 328, 467] > Collision: #ffffff, #f4f4f4 > - #fff (#ffffff) [line: 5, 144] is too close (2.217402585730237) to #f4f4f4 (#f4f4f4) [line: 162] > Collision: #f1f1f1, #e7e7e7 > - #f1f1f1 (#f1f1f1) [line: 6, 328, 467] is too close (2.124714558904567) to #e7e7e7 (#e7e7e7) [line: 7, 329] > Collision: #f1f1f1, #f4f4f4 > - #f1f1f1 (#f1f1f1) [line: 6, 328, 467] is too close (0.6212241778844915) to #f4f4f4 (#f4f4f4) [line: 162] > Collision: #e7e7e7, #f4f4f4 > - #e7e7e7 (#e7e7e7) [line: 7, 329] is too close (2.745730365307259) to #f4f4f4 (#f4f4f4) [line: 162] > Collision: #e7e7e7, #dedede > - #e7e7e7 (#e7e7e7) [line: 7, 329] is too close (1.9878587388231261) to #dedede (#dedede) [line: 351] > Collision: #d7d7d7, #dedede > - #d7d7d7 (#d7d7d7) [line: 132, 472] is too close (1.5993940299565594) to #dedede (#dedede) [line: 351] > Collision: #c7c7c7, #bdbdbd > - #c7c7c7 (#c7c7c7) [line: 135, 163, 410] is too close (2.5552779244336112) to #bdbdbd (#bdbdbd) [line: 176, 179, 182] > > > === src/media/css/infobox.styl.css === > > There are no collisions. > > > === src/media/css/lib.styl.css === > > There are no collisions. > > > === src/media/css/lightbox.styl.css === > > Collision: #ffffff, #f1f1f1 > - #fff (#ffffff) [line: 3] is too close (2.8384025881055353) to #f1f1f1 (#f1f1f1) [line: 49] > > > === src/media/css/listing.styl.css === > > Collision: #f1f1f1, #ffffff > - #f1f1f1 (#f1f1f1) [line: 73, 142, 533] is too close (2.8384025881055353) to #fff (#ffffff) [line: 171, 249, 321, 457, 493, 554, 557] > Collision: #f1f1f1, #e7e7e7 > - #f1f1f1 (#f1f1f1) [line: 73, 142, 533] is too close (2.124714558904567) to #e7e7e7 (#e7e7e7) [line: 254, 465] > Collision: #d7d7d7, #d0d0d0 > - #d7d7d7 (#d7d7d7) [line: 143] is too close (1.6491857990212937) to #d0d0d0 (#d0d0d0) [line: 500] > Collision: #c7c7c7, #d0d0d0 > - #c7c7c7 (#c7c7c7) [line: 172, 495] is too close (2.1987268353004232) to #d0d0d0 (#d0d0d0) [line: 500] > > > === src/media/css/menu.styl.css === > > There are no collisions. > > > === src/media/css/modal.styl.css === > > There are no collisions. > > > === src/media/css/navbar.styl.css === > > Collision: #e0e0e0, #d7d7d7 > - #e0e0e0 (#e0e0e0) [line: 28, 153] is too close (2.0475724038200602) to #d7d7d7 (#d7d7d7) [line: 38] > > > === src/media/css/nominate.styl.css === > > There are no collisions. > > > === src/media/css/notification.styl.css === > > There are no collisions. > > > === src/media/css/paginator.styl.css === > > There are no collisions. > > > === src/media/css/pretty-select.styl.css === > > There are no collisions. > > > === src/media/css/promo-grid.styl.css === > > Collision: #eeeeee, #fcfcfc > - #eee (#eeeeee) [line: 3, 48] is too close (2.8712928654793726) to #fcfcfc (#fcfcfc) [line: 151] > Collision: #eeeeee, #eff1f3 > - #eee (#eeeeee) [line: 3, 48] is too close (1.3693729010058453) to #eff1f3 (#eff1f3) [line: 163, 193] > Collision: #eeeeee, #efefef > - #eee (#eeeeee) [line: 3, 48] is too close (0.21035618674449746) to #efefef (#efefef) [line: 178] > Collision: #eeeeee, #eceff1 > - #eee (#eeeeee) [line: 3, 48] is too close (1.5710542885726348) to #eceff1 (#eceff1) [line: 184] > Collision: #ffffff, #fcfcfc > - rgba(255,255,255,0.5) (#ffffff) [line: 38, 133] is too close (0.5956745296239889) to #fcfcfc (#fcfcfc) [line: 151] > Collision: #cccccc, #c8c8c8 > - rgba(204,204,204,0.5) (#cccccc) [line: 39, 54] is too close (0.9839890182345273) to #c8c8c8 (#c8c8c8) [line: 171] > Collision: #fcfcfc, #eff1f3 > - #fcfcfc (#fcfcfc) [line: 151] is too close (2.6158530817473458) to #eff1f3 (#eff1f3) [line: 163, 193] > Collision: #fcfcfc, #efefef > - #fcfcfc (#fcfcfc) [line: 151] is too close (2.6610289421447013) to #efefef (#efefef) [line: 178] > Collision: #eff1f3, #efefef > - #eff1f3 (#eff1f3) [line: 163, 193] is too close (1.2958765700111121) to #efefef (#efefef) [line: 178] > Collision: #eff1f3, #eceff1 > - #eff1f3 (#eff1f3) [line: 163, 193] is too close (0.6720733619683732) to #eceff1 (#eceff1) [line: 184] > Collision: #efefef, #eceff1 > - #efefef (#efefef) [line: 178] is too close (1.5706908510520181) to #eceff1 (#eceff1) [line: 184] > > > === src/media/css/purchase.styl.css === > > There are no collisions. > > > === src/media/css/ratings.styl.css === > > Collision: #ffffff, #f1f1f1 > - #fff (#ffffff) [line: 113, 242, 368] is too close (2.8384025881055353) to #f1f1f1 (#f1f1f1) [line: 283, 286] > Collision: #e7e7e7, #f1f1f1 > - #e7e7e7 (#e7e7e7) [line: 114, 369] is too close (2.124714558904567) to #f1f1f1 (#f1f1f1) [line: 283, 286] > > > === src/media/css/reset.styl.css === > > There are no collisions. > > > === src/media/css/search.styl.css === > > There are no collisions. > > > === src/media/css/site-banner.styl.css === > > Collision: #535353, #4b4b4b > - #535353 (#535353) [line: 40] is too close (2.7580544489109853) to #4b4b4b (#4b4b4b) [line: 43] > > > === src/media/css/site.styl.css === > > Collision: #f1f1f1, #e7e7e7 > - #f1f1f1 (#f1f1f1) [line: 22] is too close (2.124714558904567) to #e7e7e7 (#e7e7e7) [line: 50] > Collision: #f1f1f1, #ffffff > - #f1f1f1 (#f1f1f1) [line: 22] is too close (2.8384025881055353) to #fff (#ffffff) [line: 95, 272, 277] > Collision: #c7c7c7, #cccccc > - #c7c7c7 (#c7c7c7) [line: 182, 222] is too close (1.2328610597909233) to #ccc (#cccccc) [line: 369] > Collision: #5f5f5f, #666666 > - #5f5f5f (#5f5f5f) [line: 235, 248] is too close (2.5927447914198956) to #666 (#666666) [line: 406] > Collision: #d7d7d7, #cccccc > - #d7d7d7 (#d7d7d7) [line: 284] is too close (2.6149618265228445) to #ccc (#cccccc) [line: 369] > > > === src/media/css/splash.styl.css === > > There are no collisions. > > > === src/media/css/tiles.styl.css === > > There are no collisions. > > > === src/media/css/typography.styl.css === > > Collision: #666666, #5f5f5f > - #666 (#666666) [line: 54, 64] is too close (2.5927447914198956) to #5f5f5f (#5f5f5f) [line: 93, 105] >