介紹
randomColor是一個生成隨機顏色的JavaScript腳本,對於寫代碼的我們來說,生成一個隨機顏色或許並不複雜,但是想要生成一個比較吸引人的隨機顏色可能是需要花費一番功夫的,但如果已經有人實現了這樣一個小功能,那麼我們直接使用即可,不需要再花費心思研究那麼深,一起來看看吧!
randomColor已移植到C#,C ++,Go,Haskell,Mathematica,PHP,Python,Swift,Perl6,Objective-C,Java,R,Reason和Rust。
Github地址
https://github.com/davidmerfield/randomColor
使用方式
本文只是簡單介紹下在瀏覽器中使用,我相信在Web開發中使用的還是最多的,我們可以直接使用cdn或者下載腳本下來直接引入:
- 使用
var color = randomColor();
要在伺服器上使用帶有node.js的randomColor,請從npm安裝randomColor,然後調用腳本:
var randomColor = require('randomcolor'); // 引入var color = randomColor(); // 16進位
- 配置
可以傳遞配置對象以便於產生特定的結果出來:
hue ——控制生成的顏色的色調。可以傳代表顏色名稱的字符串:當前支持紅色,橙色,黃色,綠色,藍色,紫色,粉紅色和黑白(red, orange, yellow, green, blue, purple, pink 和 monochrome)。如果您傳遞十六進位顏色字符串(例如#00FFFF),則randomColor將提取其色相值並使用該值生成顏色
luminosity——控制所生成顏色的亮度。您可以指定一個包含亮,亮或暗的字符串(bright, light or dark)。
count——指定要生成的顏色數
seed 一個整數或字符串,該整數或字符串在傳遞時將導致randomColor每次返回相同的顏色。
format ——指定生成的顏色的格式。可能的值為rgb,rgba,rgbArray,hsl,hsla,hslArray和hex(默認值)。
alpha ——介於0和1之間的十進位數。僅當使用帶有alpha通道的格式(rgba和hsla)時才相關。默認為隨機值。
- 示例代碼
// 返回具顏色的十六進位代碼randomColor(); // 返回十個綠色的數組randomColor({ count: 10, hue: 'green'});// 返回淺藍色的十六進位代碼randomColor({ luminosity: 'light', hue: 'blue'});// 返回「真正隨機」顏色的十六進位代碼randomColor({ luminosity: 'random', hue: 'random'});// 返回RGB的明亮的顏色randomColor({ luminosity: 'bright', format: 'rgb' // e.g. 'rgb(225,200,20)'});// 返回帶有隨機alpha的深色RGB顏色randomColor({ luminosity: 'dark', format: 'rgba' // e.g. 'rgba(9, 1, 107, 0.6482447960879654)'});// 返回具有指定alpha的深色RGB顏色randomColor({ luminosity: 'dark', format: 'rgba', alpha: 0.5 // e.g. 'rgba(9, 1, 107, 0.5)',});// 返回帶有隨機Alpha的淺色HSL顏色randomColor({ luminosity: 'light', format: 'hsla' // e.g. 'hsla(27, 88.99%, 81.83%, 0.6450211517512798)'});
總結
randomColor是一個小型JavaScript腳本,雖然功能不多,但是針對顏色這一塊還是非常值得使用的,對於大多數場景已經完全夠用!enjoy it!