---
title: "Convert an image into an interactive element"
slug: "/help/demos/edit/content/image-to-interactive-element"
topic: "demos"
last_updated: "2026-07-30T14:07:40.827Z"
---

:::note[Reviewer note — draft ahead of GA]

This article documents **Image → Interactive Element** (CORE-4134), gated by LaunchDarkly flag `image-to-interactive-element` (default off in code). Confirm rollout in LaunchDarkly and verify the exact editor menu labels before publishing.

:::

## **Overview**

Some captured elements come in as flat images — icons rendered as SVG-backed images, sprite-sheet buttons, or brand marks where the underlying page uses a single image instead of HTML text. **Image → Interactive Element** lets you convert one of those flat images into an interactive element inside Walnut, so you can:

- Click-target it with hotspots and guide steps
- Edit its properties like any other Walnut element
- Personalize per-node text or styling

This is especially useful when the customer-facing UI you captured leans on images for what would otherwise be a real HTML button or badge.

---

## **Before You Start**

- The feature is being rolled out gradually. If you don't see the option in the editor's right-click menu on an image, it isn't enabled for your workspace yet — reach out to your Walnut CSM.
- Only image elements are convertible; text and existing interactive elements are unaffected.

---

## **Convert an Image**

1. Open the demo in the editor.
2. Right-click the image you want to make interactive.
3. Choose **Convert to interactive element** from the menu.
4. Walnut replaces the flat image with an interactive element in the same position. You can now:
   - Add a hotspot, click-catcher, or guide step on it
   - Edit its background, size, or other element-level styling
5. Publish the demo when you're happy with the result.

The original screen capture isn't destroyed — Walnut layers the interactive element on top so the underlying capture stays intact for later re-conversion.

---

## **FAQs**

### **Does the conversion change how the demo looks?**
No. The interactive element inherits the image's position and size, so the visual is unchanged. Only the *editability* changes.

### **Can I revert an image back to a flat element?**
The conversion is scoped to the storyline, so undoing the edit in the editor rolls it back. Longer-term reverts follow standard demo edit history.

### **Does this work on any image?**
It works on captured `<img>` elements and CSS-backed image nodes. If the source is text styled to look like a button, use standard text editing instead.

:::note[Reviewer to confirm]

Verify the exact right-click / menu label ("Convert to interactive element" vs. "Make interactive"), whether the conversion is exposed elsewhere in the panel, and any per-node editable spike (CORE-4208) UI surfaces to call out.

:::