Interactive Demo Gallery

Explore different field modes, interface styles, and themes. Every example below is fully interactive.

Standard Input

Default

Standard input field with integrated color preview.

ColorPickUp.setInstance(
'.demo-standard', {
    fieldMode: 'both',
    style: 'modern',
    theme: 'light'
});

Glass UI

Style

Glassmorphism interface with dark appearance.

style: 'glass'
theme: 'dark'

Color Button

Mode

Compact trigger showing only the color button.

fieldMode: 'color'
style: 'windows11'

macOS Theme

macOS

Native macOS inspired appearance with rounded controls.

style: 'macos'
theme: 'light'

Terminal Theme

Retro

Terminal interface using green-on-black styling.

style: 'terminal'
theme: 'dark'

Advanced Features

Pro

History, harmonies, alpha support and palettes enabled.

{
    alpha: true,
    history: true,
    harmony: true,
    palette: true
}