- Collection methods for manipulating colors using the values of their properties as criteria.
- Color maps from Tailwind and ColorBrewer exposed as wrapper functions to help you kickstart your palettes.
- Utilities for setting and querying color properties.
- Wrapper functions allowing method chaining for all the utilities in the API.
- Color maps for Colorbrewer, TailwindCSS and CSS named colors exposed as wrapper functions.
- Color token parser for all types including numbers, strings (all CSS parseable string represantations of color), plain objects, arrays (or
ArrayLike
objects) and even boolean values. - Accessibility utilities when handling color in design.
As of v3.0.0 the library is ESM only. You can compile your own UMD build from source if you want it.
Assuming you already have Node already installed, you can add the package using npm/yarn or any other Node based package manager:
npm i huetiful-js
Or:
yarn add huetiful-js
# For GitHub Package use @prjctimg/huetiful-js
import { achromatic, stats, colors } from 'huetiful-js';
let all = colors('all')
let grays = all.filter(achromatic)
console.log(grays)
console.log(stats(all))
You can use also a CDN in this example, jsdelivr to load the library remotely:
Make sure to set the
type
of the script tag to module when you load it in your HTML.
import {...} from 'https://cdn.jsdelivr.net/npm/huetiful-js/lib/huetiful.min.js'
Or load the library as your HTML file using a <script>
tag:
# With script tag
<script type='module' src='https://cdn.jsdelivr.net/npm/huetiful-js/lib/huetiful.min.js'></script
<!-- Or, if you like it this way -->
<script>
import { colors } from 'https://cdn.jsdelivr.net/npm/huetiful-js/lib/huetiful.min.js'
let myPalette = colors('all','700')
</script>
This project is fully open source! Contributions of any kind are greatly appreciated! See🔍 the contributing page on the documentation site file for more information on how to get started.
License ⚖️ © 2024, Dean Tarisai🧪 & 🔬 with 🥃 in Crowhill,ZWReleased under the Apache 2.0 license.