Shapes

This example shows how to implement a custom node that can render different shapes like a circle, diamond or hexagon that are commonly used in flow charts. It also shows how to implement a sidebar component, custom minimap nodes and a node toolbar to change the color of the shapes.

This is a Pro example. Get all pro examples, 1:1 support from the xyflow team and prioritized Github issues with a React Flow Pro subscription.