Components
Color Input
A sophisticated color input component with opacity control, color swatches, and clipboard integration.
Features
-
Color Management
- HEX color input
- Visual color preview
- One-click copy to clipboard
- Color swatches for quick selection
-
Opacity Control
- Smooth slider control (0-100%)
- Visual gradient feedback
- Custom styled thumb matching selected color
- Real-time color preview
import { ColorInput } from "@/components/ui/color-input";
function ColorInputDemo() {
return (
<div className="block">
<ColorInput />
</div>
);
}
export { ColorInputDemo };
Dependencies
Source
Published
Similar components
Explore more
Part of Kokonut UI — browse the full library on 21st.dev.