colornary

🚀 Including Colornary

A lightweight javascript library for converting, parsing, and manipulating colors.

🚀 Including Colornary

Node

To include with Node, install via npm.

  $ npm install --save colornary

Browser

To use in the browser, download the script and add the tag.

  <script src="modules/colornary.js"></script> 

🌈 Converting Colors

Color ⇒ RGB

  const myRgbColor = toRgb('#fff');
  // => `rgb(255, 255, 255)`

Color ⇒ RGBA

  const myRgbaColor = toRgba('hsla(0, 0%, 100%, 0.5)');
  // => `rgb(255, 255, 255, 0.5)`

Color ⇒ Hex

  const myHexColor = toHex('hsl(195, 100%, 50%)');
  // => `#00bfff`

Color ⇒ HSL

  const myHslColor = toHsl('#ff00ff');
  // => `hsl(300, 100%, 50%)`

Color ⇒ HSLA

  const myHslaColor = toHsla('rgba(128, 0, 128, .75)');
  // => `hsla(300,100%,25%,1)`

🖌 Manipulating Colors

Lighten color by a factor

  const myLighterColor = lighten('rgb(0, 0, 0)');
  // => `rgb(26, 26, 26)`

Darken color by a factor

  const myDarkerColor = darken('rgb(255, 255, 255)', 0.5);
  // => `rgb(128, 128, 128)`

Saturate color by a factor

  const mySaturatedColor = saturate('rgb(13, 13, 13)');
  // => `rgb(14, 11, 11)`

Desaturate color by a factor

  const myDesaturatedColor = desaturate('hsla(10, 10%, 0%, 1)');
  // => `hsla(10, 0%, 0%)`

Opacify color by a factor

  const myOpacifiedColor = opacify('rgba(255,255,255,0.5)', 0.2);
  // => `rgba(255,255,255,0.7)`

Transparentize color by a factor

  const myTransparentizedColor = transparentize('rgba(255,255,255,0.5)', 0.2);
  // => `'rgba(255,255,255,0.3)'`

ℹ️ Notes

Color - A color constitues a string or JSON representation of a color, where the color is of a supported type.

Factor - A factor constitues a floating point between 0 and 1 denoting a percentage. Factors default to 0.1 (or 10%).

Supported types

• RGB/A
• HSL/A
• Hex

🎉 Contributing

Pull requests of any kind are welcome; whether it's adding a feature, improving documentation, or fixing a bug. However, there are some standard guidlines to follow when contributing code. Please read the following guide before opening a pull request

• Check for a similar existing issue.
• Provide steps to reproduce the bug.
• Provide a log/result of the bug.

• Provide documentation for new/improved features.
• Add exhaustive testing for new features.
• Follow linting rules and check build quality.