)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
}

Simple Way to Validate CSS Colors

  1. function isColor(col) {
  2.   const cache = isColor[col]
  3.   if (cache != null) {
  4.     console.log('- reading cache')
  5.     return cache
  6.   }
  7.   isColor.el.style = ''
  8.   isColor.el.style.color = col
  9.   return isColor[col] = !!isColor.el.style.color
  10. }
  11. isColor.el = document.createElement('div')
  12.  
  13.  
  14. console.log('is "red" a color?', isColor('red'))
  15. console.log('from the cache: ', isColor('red'))
  16.  
  17. console.log('is "rgbx(1, 2, 3)" a color?', isColor('rgbx(1, 2, 3)'))
  18.  
  19. console.log('is "#0f0" a color?', isColor('#0f0'))
  20.  
  21. console.log('is "hsl(192, 50%, 50%)" a color?', isColor('hsl(192, 50%, 50%)'))
  22. console.log('from the cache: ', isColor('hsl(192, 50%, 50%)'))
  23.  
  24. console.log('is "lab(2000.1337% -8.6911 -159.131231 / .987189732)" ?',
  25.   isColor('lab(2000.1337% -8.6911 -159.131231 / .987189732)'))
  26.  
  27. console.log('is "snippetZone" ?', isColor('snippetZone'))

I find this technique is usually good enough to validate colors…

// color // css // dom // graphics // hacks // hex // html // javascript // tricks
snippet.zone ~ 2021-24 /// {s/z}