Skip to content

hsluv/hsluv-javascript

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

HSLuv - Human-friendly HSL

CI npm

Installation

Install from NPM package repository:

npm install hsluv

ES modules:

import {Hsluv} from "hsluv";

CommonJS:

const {Hsluv} = require("hsluv");

HTML include:

  • Download the latest hsluv.min.js
  • Add <script src="hsluv-x.x.x.min.js"></script> to your HTML
  • Access it via the global window.Hsluv

Usage

The API is designed to avoid heap allocation. The HSLuv class defines the following public fields:

  • RGB: hex:String, rgb_r:Float [0;1], rgb_g:Float [0;1], rgb_r:Float [0;1]
  • CIE XYZ: xyz_x:Float, xyz_y:Float, xyz_z:Float
  • CIE LUV: luv_l:Float, luv_u:Float, luv_v:Float
  • CIE LUV LCh: lch_l:Float, lch_c:Float, lch_h:Float
  • HSLuv: hsluv_h:Float [0;360], hsluv_s:Float [0;100], hsluv_l:Float [0;100]
  • HPLuv: hpluv_h:Float [0;360], hpluv_p:Float [0;100], hpluv_l:Float [0;100]

To convert between color spaces, simply set the properties of the source color space, run the conversion methods, then read the properties of the target color space.

Use the following methods to convert to and from RGB:

  • HSLuv: hsluvToRgb(), hsluvToHex(), rgbToHsluv(), hexToHsluv()
  • HPLuv: hpluvToRgb(), hpluvToHex(), rgbToHpluv(), hexToHpluv()

Use the following methods to do step-by-step conversion:

  • Forward: hsluvToLch() (or hpluvToLch()), lchToLuv(), luvToXyz(), xyzToRgb(), rgbToHex()
  • Backward: hexToRgb(), rgbToXyz(), xyzToLuv(), luvToLch(), lchToHsluv() (or lchToHpluv())

For advanced usage, we also export the bounding lines in slope-intercept format, two for each RGB channel representing the limit of the gamut.

  • R < 0: r0s, r0i
  • R > 1: r1s, r1i
  • G < 0: g0s, g0i
  • G > 1: g1s, g1i
  • B < 0: b0s, b0i
  • B > 1: b1s, b1i

Example:

var conv = new Hsluv();
conv.hsluv_h = 10;
conv.hsluv_s = 75;
conv.hsluv_l = 65;
conv.hsluvToHex();
console.log(conv.hex); // Will print "#ec7d82"

Also available for Stylus. See here.

Development

Our Node.js CI workflow will build and test every push and PR to the main branch.

To publish a release, configure npm trusted publishing for the hsluv/hsluv-javascript repository and npm-publish.yml workflow, then create a GitHub Release. The release tag must match the version in package.json. The Publish to npm workflow will build the package and publish it to npm with provenance. Prerelease versions (for example 1.2.3-rc.1) are automatically published with the matching npm dist-tag.

Changelog

1.0.1

  • Fix TypeScript d.ts resolution for certain configurations.

1.0.0

  • New API to avoid heap allocation.
  • Transpiled from hsluv-haxe and converted manually to TypeScript.
  • New GitHub Actions CI for build, test and publishing automation.

0.1.0

  • Provide Typescript definitions in the NPM package.

0.0.3

  • Expose intermediate functions in the public API.

0.0.2

  • Improve packaging and minification.

0.0.1

  • Initial release under the name HSLuv. Old releases can be found here.

About

JavaScript implementation of HSLuv (revision 4)

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors