Quick use
If you just want to play around ASAP, the quickest way is to import the entire library, either as a module in your JS:
import Color from "https://colorjs.io/dist/color.esm.js";
To be able to use import
statements in your JS, your <script>
element needs type="module"
Color
as a global variable, the classic way, just include the following script in your HTML:
<script src="https://colorjs.io/dist/color.js"></script>
You can also add .min
right before the .js
extension to get a minified file.
Via npm
Run:
npm install colorjs.io
Custom bundle
Or, create a custom bundle that is tailored to your needs.
This is a work in progress and doesn't fully work yet. Right now it can generate import statements, but not an actual bundle.
[join(importStatement where include, '\n')]
[if(format = "iife", 'window.Color = window.Color || Color;', '')]
// Re-export
export default Color;
Download
How to use your custom bundle
The following assume your downloaded file is in the same directory as the JS/HTML file using it. If not, adjust the path accordingly.
If using client-side, include in your page via:
<script src="color.js" type="module"></script>
Or, include in your JS via:
import Color from "./color.js"
To be able to use import
statements in your JS, your <script>
element needs type="module"