---
source: https://www.jointjs.com/demos/stencil-vs-diagram-elements
github: https://raw.githubusercontent.com/clientIO/joint-demos/main/stencil-vs-diagram-elements/README.md
generated: 2026-04-01
format: plaintext
---

JointJS+: Stencil vs Diagram Elements <a href="https://www.jointjs.com/jointjs-plus"><img src="../jointjs-plus-badge.svg" alt="JointJS+" width="123" align="right" /></a>

Are you looking for a way to represent stencil elements in a way other than their actual appearance in the diagram? Check out this demo example that shows a different representation of elements during the drag-n-drop sequence (template-preview-diagram).

This demo is also available online at jointjs.com.

Available Versions

JavaScript

Screenshot

!screenshot