import { hex2rgb } from '@nextcss/color-tools';

const rgb = hex2rgb('#2196f3');
console.log(rgb);
// Output -> [ 33, 150, 243 ]

const rgb2 = hex2rgb('#eee');
console.log(rgb2);
// Output -> [ 238, 238, 238 ]

const [red, green, blue] = hex2rgb('#2196f3');
console.log({ red, green, blue });
// Output -> { red: 33, green: 150, blue: 243 }

import { rgb2hex } from '@nextcss/color-tools';

const hex = rgb2hex([238, 238, 238]);
console.log(hex);
// Output -> '#eeeeee'

import { colorShift } from '@nextcss/color-tools';

const color = colorShift('#eee', 10);
console.log(color);
// Output -> #d6d6d6

const color2 = colorShift('#eee', -10);
console.log(color2);
// Output -> #f0f0f0

import { toneMap } from '@nextcss/color-tools';

const toneMap = toneMap('#eee');
console.log(toneMap);

// Output -> {
//   50: '#fdfdfd',
//   100: '#fcfcfc',
//   150: '#fbfbfb',
//   200: '#f9f9f9',
//   250: '#f7f7f7',
//   300: '#f5f5f5',
//   350: '#f3f3f3',
//   400: '#f1f1f1',
//   450: '#f0f0f0',
//   500: '#eeeeee',
//   550: '#d6d6d6',
//   600: '#bebebe',
//   650: '#a7a7a7',
//   700: '#8f8f8f',
//   750: '#777777',
//   800: '#5f5f5f',
//   850: '#474747',
//   900: '#303030',
//   950: '#242424',
// }