Installation
Include the compiled stylesheet and JavaScript bundle in your project.
<link rel="stylesheet" href="./dist/colorpickup.min.css">
<script src="./dist/colorpickup.min.js"></script>
Basic Usage
Attach data-colorpickup to any text input or initialize the library programmatically.
<input type="text" value="#2563eb" data-colorpickup>
ColorPickUp({
el: ".my-custom-selector",
theme: "light",
style: "modern"
});
Core Features
16 Interface Styles
Choose from Glassmorphism, Material, macOS, Windows, Terminal, and many other professionally designed interfaces.
Advanced Theme Engine
Instantly switch between multiple professionally crafted themes including Dracula, Nord, Solarized, and Catppuccin.
WCAG Accessibility
Real-time contrast validation and accessibility auditing help build inclusive user experiences.