JSPM

@eyas-design/color

1.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • 0
  • Score
    100M100P100Q28052F
  • License MIT

EyasDesign color utils

Package Exports

  • @eyas-design/color
  • @eyas-design/color/src/index.js

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 (@eyas-design/color) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

eyasDesign Color

eyasDesign Color Utils.

For a given color, a gradient swatch containing ten colors is generated with an algorithm. This works for both light and dark modes.

Usage

npm i @eyas-design/color
import { generate, presetColor } from '@eyas-design/color';

console.log(generate('#123456'));

console.log(presetColor);
// {
//   red: {...},
//   orangered: {...},
//   orange: {...},
//   gold: {...},
//   yellow: {...},
//   lime: {...},
//   green: {...},
//   cyan: {...},
//   blue: {...},
//   eyasblue: {...},
//   purple: {...},
//   pinkpurple: {...},
//   magenta: {...},
//   gray: {...}
// }

API

generate(color: string, options: Object);

options.index {number | 1-10}

Index (starting from 1) of the gradient colors to be generated.

options.list {boolean}

Whether to generate color array containing the ten colors.

options.dark

Whether to generate colors for dark mode.

options.format {'hex' | 'rgb' | 'hsl'}

Color format.

getPresetColors {Function}

Contains 14 preset sets of colors.

  • red
  • orangered
  • orange
  • gold
  • yellow
  • lime
  • green
  • cyan
  • blue
  • eyasblue
  • purple
  • pinkpurple
  • magenta
  • gray
const { red } = getPresetColors();

console.log(red.light);
console.log(red.dark);
console.log(red.primary);

getRgbStr(color: string)

For a given color, get the r, g, b value in string

getRgbStr('#F53F3F') // 245,63,63