Color Picker Card

This feature is only available in ESP-DASH Pro

The Color Picker Card allows users to select a color, returning a hex string (e.g., #FF0000).

Initializer

To create a color picker card in ESP-DASH v5, use the dash::ColorPickerCard class. The value type is always dash::string.

Example:

dash::ColorPickerCard color(dashboard, "Color Picker");

Callback

Register a callback function to be called when the color changes:

color.onChange([](dash::string hex) {
  // Handle color selection
});

Methods

setValue(const char* color)

Set the color value (hex or color name).

colorPicker.setValue("#FF0000"); // Set to red

• Signature: void setValue(const char* color)
• Parameters:
  • const char* color — The color value (hex string or color name).
• Returns: void

value()

Get the current color value.

const char* color = colorPicker.value();

• Signature: const char* value()
• Parameters: None
• Returns: const char* — The current color value.

Reference

Below is a reference code showing how to integrate this widget in a real project, including initialization and value updates usage.

// Create a color picker card
dash::ColorPickerCard colorCard(dashboard, "Color Picker");
 
void setup() {
  // ...
  colorCard.setValue("#FF0000");
}
 
void loop() {
  // ...
}