Color Picker Input Element

The Color Picker Input element provides a visual interface for users to select colors from a predefined palette of hex values.

Live Preview

Color Picker Preview

Specifications

Color pickers are ideal for personalizing site themes or product variants:

  • Custom Palette: Define a list of Colors (hex strings) that the picker will show to the user.
  • Initial Selection: Set a Default Value (hex code) that is pre-selected on page load.
  • Sizing: Choose from Small, Medium, or Large heights to match your form's aesthetics.
  • Validation: Easily mark color selection as Required for essential data collection.
  • Interactive Icons: Includes built-in icons for better visual feedback during selection.

AI Guidance

How to prompt for Color Pickers:

  • Add a color picker with choices for brand primary colors.
  • Create a required color selection for choosing a theme background.
  • Insert a small color picker that defaults to absolute white.