# @ant-design/fast-color > fast and small color class Latest version **3.0.1** (published 2026-01-26) · MIT license · 0 weekly downloads ## Install ```sh npm install @ant-design/fast-color pnpm add @ant-design/fast-color yarn add @ant-design/fast-color bun add @ant-design/fast-color ``` ## Health **Score 60/100 (C)** — status: stable. Positive: has types; esm support; no vulnerabilities; high quality score. Warnings: low downloads. ## Facts | | | |---|---| | Version | 3.0.1 | | Published | 2026-01-26 | | First published | 2024-06-28 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Node | >=8.x | | Dependencies | 0 | | Unpacked size | 55 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 23 | | Author | Guo Yunhe | | Maintainers | afc163, zombiej, chenshuai2144, arvinxx, madccc, ranranup123 | | Keywords | react, react-component, react-trigger, trigger | ## Links - npm: https://www.npmjs.com/package/@ant-design/fast-color - Repository: https://github.com/ant-design/fast-color - Issues: https://github.com/ant-design/fast-color/issues - npm.io page: https://npm.io/package/@ant-design/fast-color ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 3.0.1 (latest) — 2026-01-26 - 3.0.0 — 2025-03-21 - 2.0.6 — 2024-08-06 - 2.0.5 — 2024-08-05 - 2.0.4 — 2024-07-24 - 2.0.3 — 2024-07-20 - 2.0.2 — 2024-07-19 - 2.0.1 — 2024-07-19 - 2.0.0 — 2024-07-19 - 1.3.0 — 2024-07-19 - 1.2.6 — 2024-07-12 - 1.2.5 — 2024-07-12 - 1.2.4 — 2024-07-12 - 1.2.3 — 2024-07-12 - 1.2.1 — 2024-07-11 - … 3 more at https://npm.io/package/@ant-design/fast-color/versions ## README # @ant-design/fast-color Fast color class. [![NPM version][npm-image]][npm-url] [![npm download][download-image]][download-url] [![build status][github-actions-image]][github-actions-url] [![Test coverage][codecov-image]][codecov-url] [![bundle size][bundlephobia-image]][bundlephobia-url] [![dumi][dumi-image]][dumi-url] [npm-image]: http://img.shields.io/npm/v/@ant-design/fast-color.svg?style=flat-square [npm-url]: http://npmjs.org/package/@ant-design/fast-color [github-actions-image]: https://github.com/ant-design/fast-color/actions/workflows/main.yml/badge.svg [github-actions-url]: https://github.com/ant-design/fast-color/actions/workflows/main.yml [codecov-image]: https://img.shields.io/codecov/c/github/ant-design/fast-color/main.svg?style=flat-square [codecov-url]: https://codecov.io/gh/ant-design/fast-color/branch/main [david-url]: https://david-dm.org/ant-design/fast-color [david-image]: https://david-dm.org/ant-design/fast-color/status.svg?style=flat-square [david-dev-url]: https://david-dm.org/ant-design/fast-color?type=dev [david-dev-image]: https://david-dm.org/ant-design/fast-color/dev-status.svg?style=flat-square [download-image]: https://img.shields.io/npm/dm/@ant-design/fast-color.svg?style=flat-square [download-url]: https://npmjs.org/package/@ant-design/fast-color [bundlephobia-url]: https://bundlephobia.com/result?p=@ant-design/fast-color [bundlephobia-image]: https://badgen.net/bundlephobia/minzip/@ant-design/fast-color [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square [dumi-url]: https://github.com/umijs/dumi ## Install [![@ant-design/fast-color](https://nodei.co/npm/@ant-design/fast-color.png)](https://npmjs.org/package/@ant-design/fast-color) ## Usage ```js import { FastColor } from '@ant-design/fast-color'; // input new FastColor('#666'); // short hex new FastColor('#66ccff'); // hex new FastColor('#66ccffaa'); // hex with alpha new FastColor('rgba(102, 204, 255, .5)'); // old css rgb syntax new FastColor('rgb(102 204 255 / .5)'); // new css rgb syntax new FastColor('hsl(270, 60, 40, .5)'); // old css hsl syntax, with or without unit new FastColor('hsl(270deg 60% 40% / 50%)'); // new css hsl syntax, with or without unit new FastColor({ r: 102, g: 204, b: 255, a: 0.5 }); // rgb object new FastColor({ h: 270, s: 0.6, l: 0.4, a: 0.5 }); // hsl object new FastColor({ h: 270, s: 0.6, v: 0.4, a: 0.5 }); // hsv object // clone const color = new FastColor('#66ccff'); const color2 = new FastColor(color); // clone via constructor const color3 = color2.clone(); // call clone method // output color.toHexString(); // #66ccff color.toRgb(); // Object { r: 102, g: 204, b: 255, a: 1 } color.toRgbString(); // rgb(102,204,255) color.toHsl(); // Object { h: 200, s: 0.6, l: 0.7, a: 1 } color.toHslString(); // hsl(200,60%,70%) color.toHsv(); // Object { h: 200, s: 0.6, v: 1, a: 1 } ``` ## Compatibility | 浏览器 | IE / Edge | Firefox | Chrome | Safari | Electron | | --- | :---: | :---: | :---: | :---: | :---: | | 支持版本 | ![](https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png)
IE11, Edge | ![](https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)
最近2个版本 | ![](https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)
最近2个版本 | ![](https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png)
最近2个版本 | ![](https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png)
最近2个版本 | ## API TODO ## License @ant-design/fast-color is released under the MIT license. --- _Source: https://npm.io/package/@ant-design/fast-color · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._