Image hotspot

Image hotspot creates interactive assessments where learners click on specific areas within an image. It’s ideal for testing visual recognition, spatial understanding, or identifying elements in diagrams, charts, maps, and other visuals.

Style settings

Property	Description
Image
Rounding	Adjust corner radius of the main image container
Display border	Toggle border visibility around the main image (Yes/No)
Answer area (preview)
Background color	Define the background color for feedback areas that appear when spots are selected
Border color	Set the color for borders around feedback areas
Spot (preview)
Background image (all spots)	Upload or select a custom image to use as background for all clickable hotspots
Background color	Set the default background color for clickable hotspots
Hovered	Define the color that appears when users hover over hotspots
Height	Set the vertical size of hotspot indicators (in pixels)
Width	Set the horizontal size of hotspot indicators (in pixels)
Hover color	Define the color that appears when hovering over any hotspot
"Correct" spot (preview)
Background color	Set the background color for correctly selected hotspots (default: green success color)
"Correct" icon	Upload or select a custom icon to display when a correct hotspot is selected
"Incorrect" spot (preview)
Background color	Set the background color for incorrectly selected areas (default: red error color)
"Incorrect" icon	Upload or select a custom icon to display when an incorrect spot is selected
Effects
Image shadow	Add and configure shadow effects for the main image container: - Click the "+" icon to add shadow effects
Spot pulsation	Toggle pulsation animation effect for hotspots (Yes/No)