Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/GraphiteEditor/Graphite/llms.txt

Use this file to discover all available pages before exploring further.

The node graph is the procedural engine beneath every Graphite document. Rather than recording a series of manual edits, each visible layer corresponds to a chain of nodes that generate and transform graphical data on demand. Adjusting any parameter anywhere in that chain instantly updates the final artwork, making experimentation fast and non-destructive.

What is a Node?

A node is a self-contained processing unit. Each node has one or more input connectors on its left side (accepting typed data), performs a defined operation, and produces a result through the output connector on its right side. Data flows left to right through the chain. Nodes can encode simple operations — like Fill (paints a shape with a color) or Transform (moves, rotates, or scales content) — or complex ones like Repeat Radial, which distributes copies of geometry around a circle at a configurable radius, start angle, and instance count. The key insight is that the operation is stored as a recipe, not as a baked result, so changing any parameter at any time reruns the recipe automatically. Every parameter you see in the Properties panel corresponds directly to an input on the node. Parameters can be given a fixed value or exposed as graph-level connectors that receive data from another node’s output.

Layers vs. Nodes

Graphite blends a familiar layer-based workflow with the power of procedural nodes. It helps to know how these two views relate:
ConceptRoleDisplayed in
LayerA large entity that composites graphical data onto the canvas. Layers stack bottom-to-top — lower layers in the list appear behind upper ones. Each layer thumbnail gives a visual preview of that layer’s output.Layers panel
NodeA smaller processing step within a layer’s chain that transforms or generates data.Node graph
The Layers panel and the Node graph are two views of the same document structure. Selecting a layer in the Layers panel highlights the corresponding nodes in the graph, and vice versa. A layer is itself a special node (or group of nodes) whose output is composited into the layer stack. When a layer’s input connector is fed by another layer stack, the Layers panel treats that connection as a group, folding one stack into a parent stack. This is how nested folders and group layers work internally.

Networks

Internally, a node graph is implemented as a network — a directed acyclic graph (DAG) contained within a document or subgraph. Graphical data enters a network through Import nodes and exits through the special Output node, which routes the final result to the canvas or to the parent network.
A network must remain a directed acyclic graph — meaning it is impossible to form a loop where a node’s output feeds back, directly or indirectly, into its own input. Graphite prevents you from making such a connection. If you need iterative behavior, use Repeat nodes instead.
Networks are self-contained: from the outside, a network looks like a black box that accepts inputs and produces outputs. From the inside, it sees only the data that was explicitly imported. This isolation is what makes subgraphs composable and reusable.

Opening the Node Graph

The node graph overlays the canvas and can be shown or hidden at any time without interrupting your work:
  • Keyboard shortcut: Ctrl+Space (macOS: +Space)
  • Button: Click the Node Graph button in the viewport control bar (top-right of the canvas area)
When visible, the graph appears as a floating overlay on the canvas. You can pan the graph view by middle-clicking and dragging, and zoom with the scroll wheel, independently of the canvas zoom.

Node and Layer Controls

When a node or layer is selected, two extra controls appear on the left side of the control bar at the top of the viewport:
ControlShortcutEffect
Make Hidden / Make VisibleCtrl+HToggles the visibility state. Hidden nodes are bypassed in the data flow — their output is replaced by a passthrough of their primary input, as if the node were removed from the chain. This is equivalent to clicking the eye icon next to a layer in the Layers panel.
Preview / End PreviewAlt+click a nodeTemporarily redirects the graph’s output to the selected node instead of the final Output node. The previewed node is highlighted with a dashed, brighter border. Ending the preview restores the Output node as the active output.
The Preview feature is invaluable for debugging. Instead of disconnecting and reconnecting nodes to inspect an intermediate value, just Alt-click the node you want to inspect. Click it again (or click End Preview in the control bar) to restore normal rendering.

Subgraphs

Many built-in nodes are themselves subgraphs — networks of simpler nodes that together implement a higher-level operation. Graphite exposes these uniformly: from the outside, a subgraph node looks identical to a native node.
  • Double-click a subgraph node to dive into its interior and see (and edit) the nested network.
  • Double-click a native Rust node to open the corresponding source code in your editor — useful when contributing to Graphite’s codebase.
This composability means you can build your own reusable node libraries by encapsulating any group of nodes into a subgraph, then using that subgraph node wherever you need it — just like a built-in node.

Working with Nodes

Learn how to add, connect, configure, and organize nodes in the graph.

Node Reference

Browse the full library of built-in nodes organized by category.

Build docs developers (and LLMs) love