baianat / color-fns Goto Github PK

The functions toRgb, toHsl etc. are some practical functions, but only if the given color is a string. It could be very nice if they could take into account colors that have already been converted by fx. hexToRgb like:

toHsl(hexToRgb('#ffdd56'))

The above code will fail because the argument passed into toHsl is no longer a string. This is useful when you make a utility function that takes in some sort of color and you just want to make sure that it is a rgb object for manipulating.

concretely I have some code like this:

// My utility function
export const mix = (base, mixed, mixPct) => {
  mixPct = pct(mixPct);

  if (mixPct === 1) { return isString(mixed) ? mixed : formatRgb(mixed); }
  if (mixPct === 0) { return isString(base) ? base : formatRgb(base); }

  if (isString(base)) { base = toRgb(base); }
  if (isString(mixed)) { mixed = toRgb(mixed); }

  const clr = colorMix(base, mixed, mixPct);
  return formatRgb(clr);
};

It could be nice not to have to do:

if (isString(base)) { base = toRgb(base); }
if (isString(mixed)) { mixed = toRgb(mixed); }

just because I want to make sure the color is in the RGB format.

In my case I am testing it something like this:

  it('Should mix "rgba" colors', () => {
      const baseRgba = toRgb('#f3bc56');
      baseRgba.alpha = 0.4;

      const mixedRgba = toRgb('#53fcd6');
      mixedRgba.alpha = 0.6;

      expect(mix(baseRgba, mixedRgba, 40)).toBe('rgba(179,213,137,0.48)');
    });

Describe the bug
When setting the alpha portion on an RGB color then converting it to hex the conversion works correctly. But when the alpha portion is not set i.e undefined then it falls back to 1 which should be ff.

The offending function is rgbToHex.

To Reproduce

const rgb = 'rgb(255, 255, 255)';
const hex = toHex(rgb);

console.log(hex); // #ffffff1

Expected behavior

The alpha portion should fallback to full opacity value ff in hex color model.

CIE-LAB color model should be implemented. With basic conversions from and to RGB.

The CIELAB color space (also known as CIE Lab* or sometimes abbreviated as simply "Lab" color space) is a color space defined by the International Commission on Illumination (CIE) in 1976. It expresses color as three numerical values, L* for the lightness and a* and b* for the green–red and blue–yellow color components. CIELAB was designed to be perceptually uniform with respect to human color vision, meaning that the same amount of numerical change in these values corresponds to about the same amount of visually perceived change.

This is not a supported CSS format, so I guess its format should follow the others by convention, otherwise, if there is an established convention to represent a CIE-LAB value it should be used as its parse and format targets.

Implement YPbPr color model fns.

also written as YPBPR, is a color space used in video electronics, in particular in reference to component video cables. YPbPr is the analog version of the YCbCr color space; the two are numerically equivalent but YPbPr is designed for use in analog systems while YCbCr is intended for digital video. YPbPr is commonly referred to as component video by manufacturers; however, there are many types of component video, most of which are some form of RGB. Some video cards come with video-in video-out (VIVO) ports for connecting to component video devices.

This is not a supported CSS format, so I guess its format should follow the others by convention, otherwise, if there is an established convention to represent a YPbPr value it should be used as its parse and format targets.

we need a function that is make string type to the number type

CMYK Color Model:

• Add CMYK to the types
• Add rgbToCmyk
• Add cmykToRgb
• Parse CMYK
• update getColorModel

We need to add HSV color model fns:

• Add to the Types.
• Add rgbToHsv
• Add hsvToRgb
• Add Parse HSV

Hi I really like your library, but right now it is a bit confusing, seeing there is no documentation, that the current code is not what has been released to NPM. The new TS structure looks really good, so I was wondering when you would release this version?