generate-color
v1.0.1
Published
Generate random color(s), support RGB, material and web standard, rgb、rgba、hex format, node.js and browser environment.
Downloads
167
Maintainers
Readme
generate-color(颜色生成器)
Generate random color(s), support RGB, material and web standard, rgb、rgba、hex format, node.js and browser environment.
JavaScript 颜色生成器,支持 RGB, meterial 和 web 标准色彩模式,支持 rgb、rgba、hex 格式返回,支持 node.js 和浏览器环境。
Github Repo: https://github.com/0326/packages/tree/master/packages/generate-color
Start
npm i generate-color --save # or yarn add generate-color
Browser
import { genWebColor, genMaterialColor, default as genRGBColor } from 'generate-color'
// return hex RGB value,eg. '#0000ff'
genRGBColor()
// return web standard CSS3 Color Modules Level 4 color, eg. '#ffffff'
genWebColor()
// return material style color, eg. '#448aff'
genMaterialColor()
Node.js
const generateColor = require('generate-color')
// return hex RGB value,eg. '#0000ff'
generateColor.default()
// return web standard CSS3 Color Modules Level 4 color, eg. '#ffffff'
generateColor.genWebColor()
// return material style color, eg. '#448aff'
generateColor.genMaterialColor()
web standard mode: CSS Color Module Level 4:
- https://www.w3.org/TR/css-color-4/#named-colors
material mode:
- https://material.io/guidelines/style/color.html#color-color-palette
Advance
Custom params to get custom result.
num: custrom random colors number
// return string like '#ff0000'
genColor({ num: 1 })
// return array
genColor({ num: 2 }) // ['#ffffff', '#000000']
format
// get rgb format:rgb(255,255,255)
genColor({ format: 'rgb' })
// get rgba format:rgba(255,255,255, 1)
genColor({ format: 'rgba' })
// get hex format:ffffff
genColor({ format: 'hex' })
// get hex format,custom prefix:0xffffff, prefix works only format=hex
genColor({ format: 'hex', prefix: '0x' })
// get { r: 255, g: 255, b: 255, a: 1 } rgba object format
genColor({ format: 'object' })
algorithm: custom random algorithm
// only support Math.random()
genColor({ format: 'hex', algorithm: 'Math.random' })
rules: custom random rules (TODO)
const config = {
num: 10,
rules: {
names: ['red', 'pink', 'deep purple'],
levels: ['50', '100', '500', 'A100']
}
}
genMaterialColor(config)