手残党福音，一键生成随机颜色：randomColor

前言

在项目中常常会遇到根据一个主颜色，然后生成一整个主题色系各种层次颜色的需求，尤其在切换主题、随机展示内容等场景。

恰好找到了一库可以实现此功能，话不多说，我们一起来看看吧。

randomColor

线上 github 地址：https://github.com/davidmerfield/randomColor

目前这个项目已经被移植到了各个常用语言中，例如C#, C++, Go, Haskell,Kotlin, Mathematica, PHP, Python, Raku, Objective-C, Java, R, Reason, Dart, Ruby, Rust, Swift ,Typescript，等等。具体仓库链接可在 github 仓库页面中找到。

也就是说，这个项目不仅在 JavaScript 环境可用，其他诸如后端、移动端等等都是可用的。

官方说明为：A tiny script for generating attractive colors

即：一个生成漂亮颜色的简易脚本。

使用方式

安装

npm install randomcolor

基本使用

var randomColor = require('randomcolor'); // import the script
var color = randomColor(); // a hex code for an attractive color

每一次执行都返回了一个随机的颜色值

参数说明

• hue - 控制生成颜色的色调。可以传递表示颜色名称的字符串例如red,yellow等。如果传递十六进制颜色字符串，randomColor 将提取其色相值并使用它来生成颜色。

• luminosity – 控制生成颜色的亮度。可以使用：bright、light、dark

• count - 一个整数，指定要生成的颜色数。

• seed - 一个整数或字符串，传递时将导致 randomColor 每次都返回相同的颜色，这在主题色中可以命名使用，让每次走相同主题名称的时候，返回相同的颜色组。

• format – 一个字符串，用于指定生成的颜色的格式。可能的值为rgb,rgba,rgbArray,hsl,hsla , hslArray, hex, 默认为 hex

• alpha – 介于 0 和 1 之间的小数，默认为随机值。

场景实例代码

randomColor({
  hue:"yellow",
  luminosity:"dark",
  count:10,
  seed:"test",
  format:"hex",
  alpha:0.5
})

我们可以得到以下结果

该代码生成了 10 个黄色相关暗色主题的颜色

总结

randomColor 是一个非常轻量化的色值生成器，代码也极其简单，总共 5kb 左右。

功能也非常直接实用，希望能对大家的场景有所帮助。

– 欢迎点赞、关注、转发、收藏【我码玄黄】，各大平台同名。