カラーピッカーウィジェット
Create Your Own Color Picker Widget in Seconds for Your Website
Customize how visitors select, preview, and copy colors with flexible picker settings, display modes, palette options, color formats, and no-code styling controls.

Start With a Clear Default Color
Choose the initial color visitors see, then let them adjust the shade directly from the picker.
Picker controls include:
Default colorLive previewNative picker

Display HEX, RGB, HSL, HSV, and CMYK Values
Show the formats your visitors need, add optional WCAG contrast results, and let visitors copy the selected value with one click.
Value options include:
HEXRGBHSLHSVCMYKCopy action

Add Named Presets and Temporary Saved Colors
Add or remove labeled swatches and let visitors keep, remove, clear, or copy selections in a temporary palette row.
Palette controls include:
Preset swatchesSwatch labelsSaved colorsPalette copySwatch shape

Style the Picker for Any Page
Use light or dark themes, custom surface colors, embedded alignment, floating placement, device visibility, branding, and scoped custom CSS.
Style controls include:
Light/dark themeAccent colorFloating placementカスタムCSS
