Each element is ready to use out of the box — just drag and drop onto your page. Use workflows and exposed states to interact with them dynamically.

1. Image Comparer
• Add the element to your page.
• Set the “Before” and “After” image URLs.
• Use the Slider position state to get the current divider value.

2. Color Picker
• Add the element.
• Use the Color value state to get the selected color.
• Trigger workflows with the Color changed event.

3. Copy to Clipboard
• Set the text or dynamic data to copy.
• Trigger with a workflow action or button click.

4. QR Code Generator
• Enter any text or URL to generate a live QR code.
• Optionally set size, color, and background.

5. Switch
• Use the switch for ON/OFF logic.
• Access its is_on state in workflows.

6. Progress Bar / Ring
• Set the value property dynamically (0–100).
• Customize track and indicator colors.

7. Signature Pad
• Add the element.
• Draw using mouse or touch.
• Use the Get image action to retrieve the signature as a PNG.
• Use the Clear action to reset the canvas.