> For the complete documentation index, see [llms.txt](https://enhancio.gitbook.io/reactflow-for-bubble.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://enhancio.gitbook.io/reactflow-for-bubble.io/guides/node-templates.md).

# Node templates

Custom templates let you completely redesign how nodes look using TSX-like syntax. This is perfect for displaying custom data, icons, labels, or complex layouts inside your nodes.

## Setup

1. Enable [Enable custom templates](/reactflow-for-bubble.io/element-reference/fields.md#enable-custom-templates) in your React Flow element
2. Modify the template in the [Custom node template](/reactflow-for-bubble.io/element-reference/fields.md#custom-node-template) field

## Template Variables Available

* **label** - Node display text
* **imageUrl** - Node image URL
* **nodeData** - All your Bubble database fields for this node
* **Handle** - Component for connection positions
* To see more, enable [Debug template variables](/reactflow-for-bubble.io/element-reference/fields.md#debug-template-variables) element field

For examples and complete syntax reference, see the [demo](https://react-flow-demo.bubbleapps.io/version-test) or [HTM documentation](https://github.com/developit/htm).
