Inspector
Click any element on the canvas to tweak it visually.
The inspector is a dev-only overlay built into the open-slide runtime. Toggle
it from the toolbar (or press i), then click any element on the slide.
Two surfaces
The inspector exposes two ways to edit a slide:
01 · Visual editor
Click an element. A property panel opens with editable inputs:
- Text — replace inline.
- Typography — font family, weight, size, letter-spacing.
- Colour — text colour, background colour.
- Image src — swap to any file in the deck's assets folder or the global
assets/folder; the Replace picker has a Slide / Global toggle and rewrites the import accordingly (./assets/...or@assets/...).
All edits buffer in memory until you press Save in the SaveBar. One save lands as a single HMR write to disk.
02 · Comments
Sometimes the change is easier to describe than to perform. Click an element, pick Comment, type a note:
use the accent colour on this title
The inspector pins the note as an @slide-comment marker in the source. The
marker travels with the element and is invisible at runtime.
Run /apply-comments in your agent — see the
iterate flow — and the agent rewrites exactly the
flagged regions, then clears the markers.
Selection is visible to your agent
The inspector publishes the currently picked element — source line/column,
tag, and text snippet — to node_modules/.open-slide/current.json whenever
you click. Ask your agent "make this bigger" and the
/current-slide skill reads that file
to find the exact JSX node, no extra "which one?" round-trip.