Utilities

Alpha / Hex Utilities

addAlphaToHex

Add an alpha channel to a hex color.

addAlphaToHex(input: string, alpha: number): HEX

import { addAlphaToHex } from 'colorizr';

addAlphaToHex('#ff0044', 0.5); // '#ff004480'
addAlphaToHex('#ff0044', 1);   // '#ff0044'

Playground

#ff004480

convertAlphaToHex

Convert an alpha value (0-1) to its 2-character hex representation.

convertAlphaToHex(input: number): string

import { convertAlphaToHex } from 'colorizr';

convertAlphaToHex(0.5);  // '80'
convertAlphaToHex(1);    // 'ff'
convertAlphaToHex(0);    // '00'

Playground

extractAlphaFromHex

Extract the alpha value from a hex color. Returns 1 if no alpha channel is present.

extractAlphaFromHex(input: string): number

import { extractAlphaFromHex } from 'colorizr';

extractAlphaFromHex('#ff004480'); // 0.5
extractAlphaFromHex('#ff0044');   // 1

Playground

0.5

removeAlphaFromHex

Strip the alpha channel from a hex color.

removeAlphaFromHex(input: string): HEX

import { removeAlphaFromHex } from 'colorizr';

removeAlphaFromHex('#ff004480'); // '#ff0044'
removeAlphaFromHex('#ff0044');   // '#ff0044'

Playground

#ff0044

Scale Helpers

getScaleStepKeys

Get the step keys that will be generated for a given number of steps. Useful for understanding the output shape of scale().

getScaleStepKeys(steps: number): number[]

import { getScaleStepKeys } from 'colorizr';

getScaleStepKeys(11);  // [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
getScaleStepKeys(5);   // [100, 300, 500, 700, 900]
getScaleStepKeys(3);   // [100, 500, 900]

Playground