Package detail

Website • Documentation

Table of COntents

• Statement
• Features
• Installing
• API

Statement

• 版本v0.0.1为基础版本,软件包的类型声明引用存在问题;
• 版本v0.0.5及之前版本,处于开发探索、修复阶段,切勿直接使用;
• 版本v0.0.6,处于稳定阶段,但README.md文档未更新;
• 版本v0.0.7及之后版本,处于稳定阶段,README.md文档已更新;可放心使用;

Features

Installing

Package manager

Using npm:

$ npm install color-processor

Using bower:

$ bower install color-processor

Using yarn:

$ yarn add color-processor

Using pnpm:

$ pnpm add color-processor

On demand import, you can handle it this way:

import { TO_HEX } from 'color-processor';
console.log(TO_HEX({ r: 12, g: 34, b: 56 }));

Global import, you can handle it this way:

import * as ColorProcessor from 'color-processor';
console.log(ColorProcessor.TO_HEX({ r: 12, g: 34, b: 56 }));

HTML Link Using:

/** 本地测试: 需开启本地服务进行测试; 否则出现跨域报错提示; */
 <script
    type="module"
    src="/node_modules/color-processor/dist/color-processor.umd.js"
></script>

<script type="module">
    /** 全局变量 ColorProcessor  */
    console.log(ColorProcessor);
</script>

API

RGB_TO_HSL(rgb: RGB): HSL

颜色转换: RGB颜色对象转换为HSL颜色对象;

Parameters

Return

HSL

Example

import { RGB_TO_HSL } from 'color-processor';

console.log(RGB_TO_HSL({ r: 12, g: 34, b: 56 }));

HSL_TO_RGB(hsl: HSL): RGB

颜色转换: HSL颜色对象转换为RGB颜色对象;

Parameters

Return

RGB

Example

import { HSL_TO_RGB } from 'color-processor';

console.log(HSL_TO_RGB({ h: 0.5, s: 0.3, l: 0.25 }));

RGB_TO_HEX(rgb: RGB): HEX

颜色转换:RGB颜色对象转换为HEX颜色对象;

Parameters

Return

HEX

Example

import { RGB_TO_HEX } from 'color-processor';

console.log(RGB_TO_HEX({ r: 12, g: 34, b: 56 }));

HEX_TO_RGB(hex: HEX): RGB

颜色转换:HEX颜色对象转换为RGB颜色对象;

Parameters

Return

RGB

Example

import { HEX_TO_RGB } from 'color-processor';

console.log(HEX_TO_RGB('#2e467f'));

HEX_TO_HSL(hex: HEX): HSL

颜色转换:HEX颜色对象转换为HSL颜色对象;

Parameters

Return

HSL

Example

import { HEX_TO_HSL } from 'color-processor';

console.log(HEX_TO_HSL('#2e467f'));

HSL_TO_HEX(hsl: HSL): HEX

颜色转换:HSL颜色对象转换为HEX颜色对象;

Parameters

Return

HEX

Example

import { HSL_TO_HEX } from 'color-processor';

console.log(HSL_TO_HEX({ h: 0.5, s: 0.3, l: 0.25 }));

TO_HEX(color: HEX | HSL | RGB): HEX

颜色转换: 任意格式颜色对象转换为HEX颜色对象;

Parameters

Return

HEX

Example

import { TO_HEX } from 'color-processor';

console.log(TO_HEX('#2e467f'));
console.log(TO_HEX({ r: 12, g: 34, b: 56 }));
console.log(TO_HEX({ h: 0.5, s: 0.3, l: 0.25 }));

TO_HSL(color: HEX | HSL | RGB): HSL

颜色转换: 任意格式颜色对象转换为HSL颜色对象;

Parameters

Return

HSL

Example

import { TO_HSL } from 'color-processor';

console.log(TO_HSL('#2e467f'));
console.log(TO_HSL({ r: 12, g: 34, b: 56 }));
console.log(TO_HSL({ h: 0.5, s: 0.3, l: 0.25 }));

TO_RGB(color: HEX | HSL | RGB): RGB

颜色转换: 任意格式颜色对象转换为RGB颜色对象;

Parameters

Return

RGB

Example

import { TO_RGB } from 'color-processor';

console.log(TO_RGB('#2e467f'));
console.log(TO_RGB({ r: 12, g: 34, b: 56 }));
console.log(TO_RGB({ h: 0.5, s: 0.3, l: 0.25 }));

BLEND_COLOR(base: HEX | HSL | RGB, blend: HEX | HSL | RGB, level: number ): RGB

颜色混合: 获取基础色、混合色所构成一定亮度的色值

Parameters

Return

RGB

Example

import { BLEND_COLOR } from 'color-processor';

console.log(BLEND_COLOR('#2e467f', '#ff0000', 0.5));
console.log(BLEND_COLOR({ r: 12, g: 34, b: 56 }, { r: 12, g: 34, b: 56 }, 0.5));

BLEND_LEVEL_COLOR(base: HEX | HSL | RGB): BlendLevelColor

颜色混合: 获取基础色与不同亮度下的色值

Parameters

Return

BlendLevelColor

Example

import { BLEND_LEVEL_COLOR } from 'color-processor';

console.log(BLEND_LEVEL_COLOR('#2e467f'));

License

MIT