设计颜色

Arco Design Color Utils. (原始内容存档于2018-09-29).

对于给定的颜色,用一个算法生成包含十种颜色的梯度表. 这对光和暗两种模式都有效.

使用量

npm i @arco-design/color

import { generate, presetColor } from '@arco-design/color';

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

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

API 密码

生成( 颜色: 字符串, 选项: 对象) ;

选项.index {数字 {{}1-10}

生成梯度颜色的索引(从 1 开始).

选项。 列表 {布尔}

是否生成包含十种颜色的颜色数组 .

选项. 暗

是否为暗模式生成颜色 .

选项.format {'hex'\'rgb'\'hsl'}

颜色格式.

获取预设颜色 {功能}

包含14套预设的颜色.

• red
• orangered
• orange
• gold
• yellow
• lime
• green
• cyan
• blue
• arcoblue
• purple
• pinkpurple
• magenta
• gray

const { red } = getPresetColors();

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

获取RgbStr( 颜色: 字符串)

对于给定的颜色, 获取字符串中的 r, g, b 值

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