Provide rgb values to support css custom properties. about open-color HOT 7 CLOSED

There is already a handelbars helper called hex2rgb which returns the incoming hex string as an {r, g, b} object. (It's nearly the same as the inkscape template)

You basically have to call the helper on each color.hex and put the result where you want it to be (in the .css template file).

I could do it if nobody else wants to take this issue.

from open-color.

we can use https://github.com/sindresorhus/hex-rgb

from open-color.

Hi! That seems to be great idea, even though I'm not familiar with new css custom props. Currently Open color is being automatically generated from configuration file (https://github.com/yeun/open-color/blob/master/open-color.json) and they are described as HEX values, so it needs to be converted while they are generated. (https://github.com/yeun/open-color/blob/master/compile-templates.js) I'll take a look when I'll have time, but of course you can submit PR if you want. Thanks for suggestion 😄

from open-color.

Hey, great, it should be pretty easy. This works fine and gives you an array with the rgb values.

const hexToRgb = hex =>
  hex.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i
             ,(m, r, g, b) => '#' + r + r + g + g + b + b)
    .substring(1).match(/.{2}/g)
    .map(x => parseInt(x, 16))

Usage e.g.:

console.log(hexToRgb("#0033ff")) // [0, 51, 255]

source: http://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb

CSS Custom properties is the official name for css variables, as use in https://github.com/yeun/open-color/blob/master/open-color.css

from open-color.

Even better.

from open-color.

@makepanic I will not get to it soo, so if you could do it that would be great.

from open-color.

@makepanic Oh, I haven't noticed. Please work on, if you don't mind 😄

from open-color.