The Image Component allows you to easily upload and display images, such as logos, illustrations, or other visual elements. Whether you’re branding your form with a logo or adding images to enrich your content, this component provides a simple way to enhance the visual appeal of your form.
Example Image Component
Jazz up your form with logos or visuals.When should I use an Image?
This component is perfect for scenarios where you need to include visual context.
Here are some common scenarios where an Image is ideal:
Branding
Display your organization’s logo at the top of a form.
Display your organization’s logo at the top of a form.
Visual Instructions
Provide images that give clarity to form sections or instructions.
Provide images that give clarity to form sections or instructions.
Features & Configuration
Adding an Image to your form is straightforward. Simply click on the Date/Time option in the component library and drag it onto the canvas.
After placing the image, you can customize its properties in the right-hand panel:
Properties
Width
Choose a width (between 1 and 12).
Choose a width (between 1 and 12).
Label (Alt Text)
Provide a text description of the image for accessibility purposes.
Provide a text description of the image for accessibility purposes.
Source
Upload an image directly or paste an already existing URL.
Upload an image directly or paste an already existing URL.
Attributes
Size
Within the column width you chose above, you can also specify the size as a percentage.
Within the column width you chose above, you can also specify the size as a percentage.
Alignment
Control how the image is positioned (left, center, or right).
Control how the image is positioned (left, center, or right).
Details
ID
Each Droplet component has a unique ID to reference in other parts of your form, workflow, and notifications. It's best to edit these IDs to make them a bit more descriptive.
Each Droplet component has a unique ID to reference in other parts of your form, workflow, and notifications. It's best to edit these IDs to make them a bit more descriptive.
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article