用于React和Preact的小而快的选色器组件 - react-colorful

一组微小的、快速的、可访问的、移动友好的颜色选择器组件，用于React和Preact应用程序。

如何使用它

1.安装并导入拾色器组件。

# Yarn
$ yarn add react-colorful

# NPM
$ npm i react-colorful

import {
  HexColorPicker,
  HexAlphaColorPicker,
  RgbColorPicker,
  RgbaColorPicker,
  RgbStringColorPicker,
  RgbaStringColorPicker,
  HslColorPicker,
  HslaColorPicker,
  HslStringColorPicker,
  HslaStringColorPicker,
  HsvColorPicker,
  HsvaColorPicker,
  HsvStringColorPicker,
  HsvaStringColorPicker,
} from "react-colorful";

2.将拾色器组件添加到应用程序中。

const YourComponent = () => {
  const [color, setColor] = useState("#aabbcc");
  return <HexColorPicker color={color} onChange={setColor} />;
};

const YourComponent = () => {
  const [color, setColor] = useState({ r: 50, g: 100, b: 150 });
  return <RgbColorPicker color={color} onChange={setColor} />;
};

...

预览

The postSmall And Fast Color Picker Components For React and Preact - react-colorfulappeared first onReactScript.