Skip to content

Colvertize allows to conveniently convert colors between different formats and can apply conversion functions (like color inversion) using function composition.

License

Notifications You must be signed in to change notification settings

Philipp-M/colvertize

Repository files navigation

colvertize

GitHub Workflow Status npm version npm bundle size code coverage License dependency status

Overview

Colvertize allows to conveniently convert colors between different formats and can apply conversion functions (like color inversion) using function composition.

It is heavily based on the color implementation of the excellent darkreader

Usage

Installation:

npm i --save colvertize
# or
yarn add colvertize

UMD support in browser:

<script type="text/javascript" src="https://unpkg.com/colvertize@0.1.0"></script>

Examples:

import { convert, RGBA } from 'colvertize';

convert('rebeccapurple', 'css-hex');
// -> '#663399'
convert('#123456', 'css-rgb');
// -> 'rgb(18, 52, 86)'
convert('#123456', 'css-hsl');
// -> 'hsl(210, 65%, 20%)'
convert('#123456', 'rgb');
// -> {'r': 18, 'g': 52, 'b': 86, 'a': 1}
convert('#123456', 'hsl');
// -> {'h': 210, 's': 0.653846153846154, 'l': 0.20392156862745098, 'a': 1}


// custom conversion functions

function invertColor(c: RGBA): RGBA {
  return {
    r: 255 - c.r,
    g: 255 - c.g,
    b: 255 - c.b,
    a: c.a,
  };
}

convert('#ffffff', 'css-hex', invertColor)
// -> '#000000'

This following built-in conversion functions are supported:

import {
  convert,
  invert,
  invertDarkLight,
  gammaCorrection,
  contrastBrightness
} from 'colvertize';

convert('#ff0000', 'css-hex', invert)
// -> '#00ffff'

// dark (default: black), light (default: white), and threshold (default: 0.179) are optional options
convert('#ffff00', 'css-hex', invertDarkLight({dark: '#111', light: '#eee'}))
// -> '#111111'

// factor (default: 2.2) is an optional option
convert('#773300', 'css-hex', gammaCorrection())
// -> '#b47b00'

// contrast (default: 1.0) and brightness (default: 0) are optional options
convert('#993300', 'css-hex', contrastBrightness({ contrast: 1.5 }))
// -> '#a60d00'

For more usage information checkout the tests

License

MIT

About

Colvertize allows to conveniently convert colors between different formats and can apply conversion functions (like color inversion) using function composition.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published