Sockets and data types

Sockets are the connection points on nodes that allow data to flow in and out:

• Input sockets (left side) receive data into the node
• Output sockets (right side) send data out from the node
• Trigger sockets are special inputs that execute/update the node

Socket Types

Input Sockets

Input sockets can receive data in two ways:

1. From a connection with another node's output
2. As a constant value stored on the node

When both are present, the connection takes precedence over the constant value.

Output Sockets

Output sockets expose data generated by the node. They can:

• Connect to multiple input sockets
• Update automatically based on the node's update behavior

Trigger Sockets

Trigger sockets are special input sockets that:

• Control when a node executes
• Can be added to any node via the right-click menu
• Have different trigger methods

Learn more about a node's Update/Execution behaviour

Data Types

Sockets have specific data types that define what kind of data they can handle:

Data Type	Description	Example
any	Any type of data	Can accept any value
array	Ordered collection of items	[1, 2, 3]
boolean	True or false	true or false
code	JavaScript code	function() { return 42; }
color	Color representation	#FF0000 or rgb(255, 0, 0)
dataType	Represents a data type	"number"
deferredPixi	PIXI.js rendering object	Graphics rendering elements
dynamicEnum	Dynamic list of options	Options based on another input
enum	Fixed list of options	Selected from predefined list
file	Reference to a local resource in IndexedDB	"[file name]-[size]"
image	Base64-encoded image data	"data:image/png;base64,..."
function	JavaScript function	(x) => x * 2
html	HTML content	<div>Hello World</div>
image	Image data	PNG/JPG data
json	JSON data	{"name": "value"}
number	Numeric value	42 or 3.14
string	Text value	"Hello World"
trigger	Activation signal	Used to trigger node execution
2D vector	2D vector representation	{ "x": 0, "y": 0 }
3D vector	3D spatial representation	{ "x": 0, "y": 0, "z": 0 }
Widget Layout	Container layout and styling configuration	CSS stylings

Type Conversion

tailrmade attempts to automatically convert between compatible data types when possible:

• number to string: 42 → "42"
• string to number: "42" → 42 (if string contains a valid number)
• boolean to number: true → 1, false → 0

When a conversion isn't possible, you may need to use specific converter nodes.

Learn more about how to Build your graph