Zero Dependency • Accessible • Lightweight

Modern Color Picker
Built for Developers

ColorPickUp delivers a fast, accessible, zero-dependency color picker with multiple UI styles, advanced themes, WCAG contrast validation, and modern APIs.

Live Preview

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.