@dgcode/gcolor

color utilities for google apis

Install

$ npm install @dgcode/gcolor

Color notation

According to Google, a color is represented as a { red, green, blue, alpha } object, whose values should be ranged between 0 and 1. However many other tools and sources describe colors as hex strings, color names, or values ranged between 0 and 255; the purpose of this module is to provide seamless conversion between all different types.

Usage

import { toGoogleColor } from '@dgcode/gcolor';

toGoogleColor('#ff0000');
// { red: 1, green: 0, blue: 0, alpha: 1 }

toGoogleColor('green');
// { red: 0, green: 1, blue: 0, alpha: 1 }

toGoogleColor({ r: 255, g: 128, b: 64 });
// { red: 1, green: 0.5, blue: 0.25, alpha: 1 }

toGoogleColor({ red: 1, green: 0.5 });
// { red: 1, green: 0.5, blue: 1, alpha: 1 }

Typings

TypeScript types are exposed for convenience:

import { $ColorInput, $GoogleColor, $ColorObject } from '@dgcode/gcolor';

$ColorInput

A color input is any single value that can be converted by this module. It is typically a string (hex, color name or "rgba(...)" notation), an array of color values (between 0 and 255), an instance of color, a $ColorObject or a $GoogleColor.

$ColorObject

When providing an object with any property among r, g, b and a, it is considered a "regular" color descriptor whose color values (r / g / b) should be ranged between 0 and 255. The a component (for "alpha") is still ranged between 0 and 1.

$GoogleColor

This is the compliant object format to describe any color in Google's APIs, also the kind of object returned by toGoogleColor(...). Any object with red, green, blue or alpha properties is considered a "google color" object and those values should be ranged between 0 and 1.

Powered by the color package

This module uses the color module internally to parse color inputs. That method is re-exposed for convenience.

import { color } from '@dgcode/gcolor';

color(255, 0, 0).red(); // 255

License

MIT