loose-rgb

Loose RGB

Normalizes RGB color data types to a certain format

Description

Working with different color libraries gets cumbersome when they use different RGB value formats. Now you can normalize the outputs and convert your inputs.

Features

• Normalize any RGB format to {r, g, b, [a]}
• Convert {r, g, b, [a]} to any RGB format
• RGBA support
• Hex support

Installation

npm install loose-rgb

Usage

import looseRGB from "loose-rgb";

// Convert any type to `{r, g, b, [a]}`
looseRGB.normalize({red: 1, green: 2, blue: 3}) // ? {r: 1, g: 2, b: 3}
looseRGB.normalize("FFBB00AA") // ? {r: 255, g: 187, b: 0, a: 0.66796875}

// Convert `{r, g, b, [a]}` to any type
looseRGB.convert.toCSSValue({r: 255, g: 187, b: 0, a: 0.66796875}) // ? rgba(255, 187, 0, 0.66796875)
looseRGB.convert.toUpperKeys({r: 1, g: 2, b: 3}) // ? {R: 1, G: 2, B: 3}

// Composing the above methods
import {convert, normalize} from "loose-rgb";

const anyToHex = (rgba) => convert.toHex(normalize(rgba));
anyToHex([1, 2, 3, 0.4]) // ? #01020366

Normalize

looseRGB.normalize(color: RGBUnkown)

Input any color value as color (see convert).

Convert

looseRGB.convert[to{ColorType}](color: RGBLowerKeys)

Input an {r, g, b, [a]} color to get a reformatted value. See supported formats for methods.

Supported Formats

• .toLowerKeys()
  • {r: 1, g: 2, b: 3}
  • {r: 1, g: 2, b: 3, a: 0.4}
• .toUpperKeys()
  • {R: 1, G: 2, B: 3}
  • {R: 1, G: 2, B: 3, A: 0.4}
• .toFullKeys()
  • {red: 1, green: 2, blue: 3}
  • {red: 1, green: 2, blue: 3, alpha: 0.4}
• .toArray()
  • [1, 2, 3]
  • [1, 2, 3, 0.4]
• .toCSSValue() — Supports with and without spacing between commas, leading zero on decimal
  • "rgb(0, 213, 34)"
  • "rgba(0, 213, 34,.12)"
• .toHex() — Supports with and without pound, case insensitive, with shorthand
  • "#fff"
  • "#000000"
  • "#FFBB00AA"
  • "123"
  • "FFFF"

License

Copyright Evelyn Hathaway, MIT License

Changelog

v1.0.7

v1.0.6...v1.0.7 - 2021-06-09

📦 Package

• dev: Bump @babel/preset-env from 7.14.2 to 7.14.4 3646f2b
• dev: Bump @typescript-eslint/eslint-plugin 31bd4bc
• dev: Bump @typescript-eslint/eslint-plugin 2030f4a
• dev: Bump @typescript-eslint/parser from 4.25.0 to 4.26.0 897b7e9
• dev: Bump @typescript-eslint/parser from 4.26.0 to 4.26.1 b7f8bfc
• dev: Bump conventional-changelog-evelyn from 1.2.3 to 1.3.0 358777c
• dev: Bump eslint from 7.26.0 to 7.27.0 998a30b
• dev: Bump eslint from 7.27.0 to 7.28.0 62143ee
• dev: Bump eslint-plugin-evelyn from 5.0.4 to 5.0.5 640ac4b
• dev: Bump eslint-plugin-evelyn from 5.0.5 to 6.1.0 0bfb69a
• dev: Bump eslint-plugin-evelyn from 6.1.0 to 6.2.0 a97aa7a
• dev: Bump eslint-plugin-evelyn from 6.2.0 to 6.2.1 98a1a4e
• dev: Bump eslint-plugin-import from 2.23.2 to 2.23.3 c635f52
• dev: Bump eslint-plugin-import from 2.23.3 to 2.23.4 928f242
• dev: Bump eslint-plugin-regexp from 0.10.0 to 0.11.0 c735a7b
• dev: Bump jest from 26.6.3 to 27.0.1 4dd2e86
• dev: Bump jest from 27.0.1 to 27.0.3 a39c5b2
• dev: Bump jest from 27.0.3 to 27.0.4 9cefcd1
• dev: Bump ts-jest from 27.0.1 to 27.0.2 f744635
• dev: Bump ts-jest from 27.0.2 to 27.0.3 ec3d0ae
• dev: npm update dev deps 92c8346
• dev: npm update, linting f676ae1
• prod: Bump ts-essentials from 7.0.1 to 7.0.2 080e91f