7.3.0 • Published 3 months ago
react-color-palette v7.3.0
Installation
yarn
yarn add react-color-palette
npm
npm install react-color-palette
Usage
import { ColorPicker, useColor } from "react-color-palette";
import "react-color-palette/css";
export function App() {
const [color, setColor] = useColor("#561ecb");
return <ColorPicker color={color} onChange={setColor} />;
}
Examples
Usage rgb()
in useColor()
import { ColorPicker, useColor } from "react-color-palette";
import "react-color-palette/css";
export function App() {
const [color, setColor] = useColor("rgb(86 30 203)");
return <ColorPicker color={color} onChange={setColor} />;
}
Usage <named-color>
in useColor()
import { ColorPicker, useColor } from "react-color-palette";
import "react-color-palette/css";
export function App() {
const [color, setColor] = useColor("cyan");
return <ColorPicker color={color} onChange={setColor} />;
}
Custom Layout
import { Saturation, Hue, useColor } from "react-color-palette";
import "react-color-palette/css";
export function App() {
const [color, setColor] = useColor("hsl(120 100% 50% / .5)");
return (
<div className="custom-layout">
<Saturation height={300} color={color} onChange={setColor} />
<Hue color={color} onChange={setColor} />
</div>
);
}
HEX input only
import { ColorPicker, useColor } from "react-color-palette";
import "react-color-palette/css";
export function App() {
const [color, setColor] = useColor("#123123");
return <ColorPicker hideInput={["rgb", "hsv"]} color={color} onChange={setColor} />
}
onChangeComplete optional callback
import { ColorPicker, useColor, type IColor } from "react-color-palette";
import "react-color-palette/css";
export function App() {
const [color, setColor] = useColor("#123123");
const onChangeComplete = (color: IColor) => localStorage.setItem("color", color.hex);
return <ColorPicker hideInput={["rgb", "hsv"]} color={color} onChange={setColor} onChangeComplete={onChangeComplete} />
}
API
<ColorPicker />
<Saturation />
<Hue />
<Alpha />
useColor()
TColor
<named-color>
<hex-color>
- sRGB color space:
hsl()
,hwb()
orrgb()
IColor
IColorRgb
IColorHsv
License
7.3.0
3 months ago
7.2.2
5 months ago
7.2.1
5 months ago
7.2.0
6 months ago
7.1.1
9 months ago
7.0.0
1 year ago
7.0.4
1 year ago
7.0.3
1 year ago
7.0.2
1 year ago
7.1.0
1 year ago
7.0.1
1 year ago
6.2.0
3 years ago
6.1.0
3 years ago
6.0.0
3 years ago
5.0.0
4 years ago
4.1.0
4 years ago
4.0.0
4 years ago
3.1.0
4 years ago
3.0.0
4 years ago
2.0.3
4 years ago
2.0.2
4 years ago
2.0.1
4 years ago
2.0.0
4 years ago
1.1.8
4 years ago
1.1.7
4 years ago
1.1.6
4 years ago
1.1.5
4 years ago
1.1.4
4 years ago
1.1.3
4 years ago
1.1.2
4 years ago
1.1.1
4 years ago
1.1.0
4 years ago
1.0.2
4 years ago
1.0.1
4 years ago
1.0.0
4 years ago