Skip to content

dagthomas/hexSorterNext

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

hexSorterNext v1.0.0

Original:

alt text

Sorted:

alt text

Installation

// Load the module.
import * as hexSorterNext from './hexSorterNext';

Why hexSorter?

hexSorterNext is a typescript implementation of hexsorter.js.

Its usage is to automagically sort colors by luminosity, to generate style
sheets or vector fill/strokes.

  • Sort colors by luminosity
  • Get brightest color from array
  • Get most saturated color from array
  • Mix hexadecimal color values to create/diffuse colors
  • Choose conversion type for RGB->Y. BT.601, BT709, BT2020

Usage

import { colorMixer, sortColors, mixSortColors } from './hexSorterNext';
const log = console.log;
var colorArray = ["#516373", "#f2b999", "#f2e8c9", "#6c838c", "#f2f2f2"];

var mixColor = colorMixer(colorArray[0], "#fff", 50);
var mostBright = sortColors(colorArray, 'mostBrightColor');
var mostSaturatedColor = sortColors(colorArray, 'mostSaturatedColor');
var colorMixed = colorMixer("#516373", "#fff", 50);
var mixSort = mixSortColors(colorArray, 'mostBrightColor', "#fff", 50);

log("Mixed with 50% white: ", mixColor);
log("Sorted by brightness: ", mostBright);
log("Sorted by saturation: ", mostSaturatedColor);
log("Mix #fff sorted: ", mixSort);
log("Mix #516373 with #fff - 50%: ", colorMixed);

alt text

Example of CSS file used on SVG in HTML

alt text

About

hexSorter for the next generation

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published