Getting Started with Culori

Install Culori from npm

Culori is distributed on npm in a variety of formats. Install it with:

npm install culori

Then start importing functions from the API:

import { rgb } from 'culori';

rgb('tomato');
// ⇒ Object { mode: "rgb", r: 1, g: 0.38823529411764707, b: 0.2784313725490196 }

For code that runs in browsers, you may want to streamline the bundle to only include the parts of Culori you're using. See Optimize bundle size with tree-shaking for guidance on switching your imports to use 'culori/fn' instead of 'culori' once you're done prototyping.

Fetch Culori from a CDN

You can use Culori from your favorite Content Delivery Network to create quick prototypes in HTML. Here are a few popular choices:

Use it as an ES module:

<script type='module'>
	import { rgb } from 'https://cdn.skypack.dev/culori';
	console.log(rgb('salmon'));
</script>

...or using a traditional <script> tag. The library will be made available under the culori global variable:

<script src="https://unpkg.com/culori"></script>
<script>
	console.log(culori.rgb('salmon'));
</script>

Use Culori online

In your browser's console

The library is available on this website as the global variable culori, so can try the API in your browser's console as you read through the examples.

Observable

If you prefer to see the results visually, Observable is a great place to tinker with the library.

Add this cell and you're good to go:

culori = import('culori@4.0.1');

It's often useful to pin the library to a specific version, to make sure your old notebooks don't break if the API changes in a new major version of the library.

Use Culori in Deno

The library is published to deno.land/x/culori for usage in Deno:

import { rgb } from 'https://deno.land/x/culori@4.0.1/index.js';

rgb('tomato');