JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 31307
  • Score
    100M100P100Q154185F
  • License MIT

Generate unique and beautiful colors from any texts or numbers

Package Exports

  • uniqolor

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (uniqolor) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

uniqolor logo

GitHub release npm GitHub license

Overview

uniqolor is a fast and lightweight (~1.5KB gzipped) javascript library for generating unique and beautiful colors from any texts, numbers, UUIDs, or MongoDB ObjectIds.

Quick start

Using npm or yarn

$ npm install uniqolor

$ yarn add uniqolor

ES6 Import:

import uniqolor from 'uniqolor';

CommonJS (like nodejs, webpack, and browserify):

const uniqolor = require('uniqolor');

AMD (like RequireJS):

define(['uniqolor'], function (uniqolor) {
  // ...
})

Using <script>

Include uniqolor.js or uniqolor.min.js into your html file:

<script src="https://unpkg.com/uniqolor/dist/uniqolor.min.js" type="text/javascript"></script>
<script type="text/javascript">
  var color = uniqolor('Hello world!');
</script>

Usage

/* Generate unique color from texts or numbers */

uniqolor('Hello world!')
// { color: "#5cc653", isLight: true }

uniqolor('bf545d4c-5360-4158-a572-bd3e204185a9', { format: 'rgb' })
// { color: "rgb(128, 191, 64)", isLight: true }

uniqolor(123, {
  saturateRange: [35, 70],
  lightnessRange: 25,
})
// { color: "#621d1e", isLight: false }

/* Generate random color */

uniqolor.random()
// { color: "#644cc8", isLight: false }

uniqolor.random({ format: 'hsl' })
// { color: "hsl(89, 55%, 60%)", isLight: true }

uniqolor.random({
  saturateRange: 80,
  lightnessRange: [70, 80],
})
// { color: "#c7b9da", isLight: true }

API

uniqolor(value, [options]) ⇒ Object

Generate unique color from value

Params:

  • value (string|number)
  • options (Object, default: {})
  • options.format (string, default: 'hex'): The color format, it can be one of hex, rgb or hsl
  • options.saturateRange (number|Array, default: [50, 55]): Determines the color saturate, it can be a number or a range between 0 and 100
  • options.lightnessRange (number|Array, default: [50, 60]): Determines the color lightness, it can be a number or a range between 0 and 100

Output:

  • color (string): The generated color
  • isLight (boolean): Determines whether the color is a light color or a dark color (It's good for choosing a foreground color, like font color)

uniqolor.random([options]) ⇒ Object

Generate random color

Params:

  • options (Object, default: {})
  • options.format (string, default: 'hex'): The color format, it can be one of hex, rgb or hsl
  • options.saturateRange (number|Array, default: [50, 55]): Determines the color saturate, it can be a number or a range between 0 and 100
  • options.lightnessRange (number|Array, default: [50, 60]): Determines the color lightness, it can be a number or a range between 0 and 100

Contributing

Your ideas and contributions are welcome; check out our contributing guide

License

The unicorn shape in the logo made by Freepik is licensed by CC 3.0 BY

MIT © 2017 Rasool Dastoori