extract the algorithm into its own library and publish to NPM

Hello,

your application is really useful !

Would it be possible to extract the algorithm into its own library so we can use it directly from our projects ?

Something like :

import mcg from 'mcg'

const palette = mcg('#fefefe') // returns the object with all the generated colors

[mbitson]

While I am not offering an NPM package specifically, I am going to close this issue for now. It’s not necessarily an issue relevant to this particular repository.

That being said, the primary tool used in determining our colors is actually the tinycolor repo.

So, if you need to generate these palettes dynamically, first run: npm install tinycolor2

Once you have tinycolor setup, simply use the following to generate the array you’re looking for:

function getColorObject(value, name) {
	var c = tinycolor(value);
	return {
		name: name,
		hex: c.toHexString(),
		darkContrast: c.isLight()
	};
}
function mcg(hex){
	return [
		getColorObject(tinycolor(hex).lighten(52), '50'),
		getColorObject(tinycolor(hex).lighten(37), '100'),
		getColorObject(tinycolor(hex).lighten(26), '200'),
		getColorObject(tinycolor(hex).lighten(12), '300'),
		getColorObject(tinycolor(hex).lighten(6), '400'),
		getColorObject(tinycolor(hex), '500'),
		getColorObject(tinycolor(hex).darken(6), '600'),
		getColorObject(tinycolor(hex).darken(12), '700'),
		getColorObject(tinycolor(hex).darken(18), '800'),
		getColorObject(tinycolor(hex).darken(24), '900'),
		getColorObject(tinycolor(hex).lighten(50).saturate(30), 'A100'),
		getColorObject(tinycolor(hex).lighten(30).saturate(30), 'A200'),
		getColorObject(tinycolor(hex).lighten(10).saturate(15), 'A400'),
		getColorObject(tinycolor(hex).lighten(5).saturate(5), 'A700')
	];
}

Now, you can simply generate any palette you’d like using the originally requested JS snippet: const palette = mcg('#fefefe')

[tabuckner]

@jacarma @jgoux I realize this is like two years late, but I just published a quick sass adaptation of the core logic for the palette generation. I’ll finish up the javascript library a little later and let you guys know…even though there is probably not a use case anymore 😅