Home / Designing UI Elements

Color Swatch

Customer Success Team

Last updated on Sep 10, 2024

The Color Swatch UI element is a list of colors that allows users to preview and choose colors by clicking or tapping on the color.

To configure Color Swatch:

  1. Select the current condition of the element from the State dropdown on the right-side Properly Panel:
  • Normal: The default state of Color Swatch when it is not being interacted.
  • Hover: The state of Color Swatch when the user hovers over it with the mouse cursor.

2. Expand General to indicate the gap between the color options.

3. Make the necessary configuration of principal styling features (see Global Styles).

 

💡 If you have questions or concerns, contact us directly via the Live Chat box in the lower right corner. Our Support Team will provide you with top-notch quality support 24/7.