beta
cables is under heavy development.
There might be one or another bug, please let us know about it!

All Operators

AspectRatio

 set fixed viewport aspect ratop and letterboxing

BlendMode

 change how colors are mixed (blending/mixing modes)

Canvas2Texture

 convert a canvas to texture

CanvasFocus

 is canvas focussed ?

CanvasInBrowserViewport

check if webgl canvas element is in the current browser viewport

CanvasInfo

 the size of the canvas in pixels, aspect ratio and pixel density

ClearColor

 sets all cleared pixels to one colour. Use to change the background colour.

ClearDepth

 Clears the depth buffer (zbuffer, z buffer)

ColorMask

 enable/disable RGBA color channels of your entire scene

ColorPick

 pick a color at x,y coordinates of canvas

DepthTest

change depth testing method (depthMask,depthWrite,depthFunc)

DirectionalTranslate

 translate away from a point in space

DownloadTexture

 Download a texture as png file

DrawTextureMapping

 draw texture mapping coordinates

FaceCulling

 Disable the rendering of front or back facing triangles with culling

FontMSDF

 Load MSDF Font data and texture to use

ForceCanvasSize

 Resize canvas element to a specific pixel size or aspect ratio

GlInfo

information about the webgl context

GlPrimitive

force rendering of meshes using points,lines or triangles

GradientTexture

 texture containing a colour gradient that can be altered with an editor

GridTransform

 transform and arrange elements into a grid

Identity

reset all transforms (modelmatrix)

IdentityViewMatrix

reset the view matrix (cameras etc.)

ImageSequenceAnim

 play a image sprite animation

InteractiveRectangle

 An area which is interactive

LetterBox

Sets an aspect ratio

LineFont

 A Simple way to write text on the screen.

MainLoop

Trigger other ops once every frame to create smooth animations (renderer)

MediaRecorder

 Record the renderer-output to video

MeshInstancer

 Draw the same mesh multiple times on the GPU

MeshMorph

 morph from one geometry to another

NormalizeScreenCoordinates

convert screen pixel coordinates to range 0-1

OrTexture

outputs the first valid texture of the input ports

Orthogonal

 Orthogonal projection / objects in distance don't appear smaller (isometric)

OverwriteViewportSize

Force a manually set viewport size for connected ops

Performance

 Show WebGl Performance Statistics

PerformanceMeasure

Measure the time used to execute all child ops

Perspective

Adjust FOV, field of view, and frustum clipping

PixelProjection

 Remaps world co-ordinates to a pixel co-ordinate system

PointCollector

save points/coordinates in an array

PointCollectorCollect

collect world space coordinates into an array

PointCollectorScreenCoords

collect screen pixel coordinates into an array

RandomCluster

 Transforms objects randomly in space

RandomizeTriangles

 randomize order of triangles in a geometry

Render2Texture

Render into an Image

Render2Textures

 render to multiple textures at the same time

RenderAnim

record, render an animation and save as webm video file or png image sequence

RenderGeometry

 Render a geometry as mesh

ResetTransform

reset current transforms to initial value (identity)

SaveScreenShot

 Download the current screen content as png file

ShowNormals

 visualize normals, tangents or bitangents

SurfaceScatter

 Scatter an object on the surface of a mesh with different distribution methods

TesselateGeometry

 create new triangles in a mesh (subdivide)

TextMeshMSDF

 draw text using the FontMSDF operator

Texture2ColorArray

 extract colors from a texture

TextureArray

 create an array of textures

TextureArrayLoaderFromArray

 load multiple texture from filenames given as an array

TextureArrayLoader

 load multiple images into an array

TextureColorPick

 get the color of a pixel in a texture

TextureFromColorArray

 create a texture from an array of number values

TextureToPointArray3

 generate an array3 of grid positions from a texture

TextureToPoints

 Create points by sampling texture

Texture

 Load an image as a texture

TriggerOnCanvasResize

will trigger when canvas was resized

ValidTexture

output current input texture or a default texture

ViewPortSize

Outputs current viewport size

Viewport2

force a viewport aspect ratio

WebGlVersion

which webgl version is being used

Ops.Gl.CubeMap


WebGl Ops

Filter: All Material cameras 

CubeMapFromTextures

 generate a cubemap from 6 textures

CubeMapMaterial

 use a cubemap or equirectangular texture as a material

CubemapToEquirectangularTexture

 visualize cubemap as folded texture or equirectangular texture

EquirectangularTextureToCubemap

 convert an equirectangular map to a cubemap

RenderToCubemap

 render a scene into a cubemap

Skybox

 render an equirectangular map or a cubemap as scene background

Ops.Gl.GLTF


WebGl Ops

GltfAnimationArray

 Convert an animation into an array of coordinates

GltfCameraViewMatrix

 get view matrix from a gltf camera

GltfDracoCompression

 gltf draco compression library

GltfGeometry

 expose geometry from gltf meshes, also possible to expose submaterial geometries

GltfHierarchy

 export array of positions from a hierarchy of a branch structure in a gltf, e.g. a skeleton bones

GltfMeshSequence

 switch between meshes e.g. like a stop motion animation

GltfNodeSineAnim

 sine animate gltf nodes by a filter

GltfNodeTransform

 Get the transform from the GLTFscene op

GltfNodeTransforms

output all transformations of nodes starting with [search]

GltfNode

Control a single node from the GLTFscene op

GltfScene

 Load GLTF/GLB 3d files

GltfSetMaterial

 Assigns a material to a node inside of the gltfScene op

GltfSkin

 render a skinned mesh (bone/rigging/rigged animation)

GltfTexture

 Load textures from inside a .glb file

GltfTransformNode

set transformation of a gltf node

GltfVertexAnim

play gltf vertex anim directly with its own timing

AlignGeometry

 align a geometry / change its pivot / center / origin point

BoundingBoxVisible

 Test if a boundingbox could be visible in the current viewport

DivideGeometry

 disconnect faces/polygons of a mesh

FlipNormals

flip all normals of a geometry

FreezeMeshes

 capture all following meshes into one geometry

GeometryBoundingBox

 Calculate a bounding box from a geometry

GeometryExtrude

 basic extrusion of flat geometry

GeometryInfo

information about a geometry

GeometryMerge

 merge two geometries to one

GeometryMergeSimple

 merge two geometries into one

GeometryPoints

 Get vertices of a geometry as array3x (vertex vertices)

GeometryToObj

 Generate an .obj file as string from a geometry

GeometryUnIndex

convert geometry to only flat triangles without reusing vertices positions

ReverseVertices

 Reverses the order of vertices in a geometry, back facing triangles become front facing ones

ScaleGeometry

uniform scaling of geometry vertices

SortGeometryAxis

sort geometry triangles by position

SvgPathToGeometry

 Generate a SVG path string of a string using an opentype font

TransformGeometry

 transform vertices of geometry

AnimMatrix

 animate values in a matrix to a new matrix

ArrayPathFollow

 interpolate position on a spline/array3x

ArrayPathFollowParticles

 render lots of particles following a path/spline/array3x

ArrayTranslate

iterate over an array3: translate to xyz, then trigger next op

Billboard

 rotate an object to always face the camera

Camera

 Transforms and projects the scene from the point of view of the camera.

CameraInfo

 get camera attributes from current camera/orbit controls

CameraPosition

 get the current position of viewmatrix/camera eye

Coordinates

 current xyz coordinates (modelmatrix)

DeviceOrientationCamera

 gyroscope motionsensor camera

GetMatrixScaling

Get the scalar scaling of a matrix

GetModelMatrix

get current modelmatrix

GetProjectonMatrix

 get current projectionmatrix

GetViewMatrix

get current viewmatrix

InterpolateMatrix

interpolate between two matrices

InvertMatrix

 outputs an inverted matrix

LookatCamera

 transforms view to look from eye to center

MatrixTranslation

 get translation of a matrix

MulViewMatrix

multiply view matrix

MultiplyModelMatrix

multiply model matrix

OrbitControls

 rotate your object by clicking and dragging the mouse

Quaternion

multiplies current modelmatrix with a quaternion

QuaternionCamera

Set up a camera, rotated by a quaternion

RandomGridPlacement

 place random objects on a grid

RandomGridPlacementArrays

 Place random objects on a grid

Scale

Scale all child objects

ScaleXYZ

enlarge or shrink objects by a scale factor for every axis

ScaleXYZViewMatrix

 scale xyz of viewmatrix

ScreenCoordinates

 screen/pixel coordinates of the current transform

ScreenPosTo3d

 convert screen coordinates to a 3d position

SetProjectionMatrix

set a projection matrix

Shear

 displaces each point of a mesh in fixed direction

Transform

Transform objects in 3d space (rotate, translate, scale)

TransformMul

multiply current modelmatrix

TransformView

transform the viewmatrix

Translate

Translate objects (move / position in 3D space)

TranslateView

translate the view/camera matrix

VectorTranslate

Translate any geometry underneath it using vectors and speed.

WASDCamera

 simple camera you control with W,A,S,D keys like in a FPS game

CablesLogo

 cables logo mesh/geometry

Circle

 Draws a circle

Cone

 Draw a cone

Corner

 render a rectangular corner

Cross

 Draws a cross with controllable thickness and length.

Cube

 draw a cube

Cylinder

 draw parameterizable cylinder (aka tube,pipe,round,circle)

FloorGrid

 draw a grid on the floor

FreeFormPlane

 A freely deformable plane, rectangle, polygon

FullscreenRectangle

Draws a rectangle using the full WebGL canvas size

GeometryToTexture

 Convert vertices of a geometry to a data texture

Grid

 Draw a simple grid of lines

HeightMap

 generate a rectangular mesh where the height is defined by the luminance of an image

Helix

 generates a helix, spiral spline

Icosahedron

 Renders a icosahedron (polyhedron with 20 faces)

Line

 Draw a line between two points

LinesArray

 an array of lines

MeshInstancerFromTexture

 Draw the same mesh multiple times on the GPU

ParametricSurface

 Creates a 3d mesh from a 2d area expressions

PointCloudFromArray

 visualize an array of coordinates as points

PointCloudFromTexture

 Visualize a RGB texture as XYZ coordinates as points

Polyhedron

 Generate polyhedron meshes

Pyramid

 render a pyramid mesh

QuadWarpTexture

 Warp a texture mapped quad (projection mapping)

RectangleFrame

 Draws a rectangle frame

RectangleRounded

 Draws a rectangle with rounded corners

Rectangle

 draw a rectangle (plane, square)

SimpleSpline

 Draws a simple spline only one pixel wide

SimpleWireframe

 Simple Wireframe Line Renderer

Sphere

 Draw parameterizable sphere

SplineMeshMaterial

 material for splinemesh

SplineMesh

 draw splines/lines

Star

 draw a star mesh (saw,gear)

SuperShape

Renders a super shape

TextMesh

 Draws text in 3d space using one of the font ops

Torus

 Draw a torus (doughnut, donut, ring mesh)

Triangle

 Draw a triangle

TriangleArray

 Draws multiple triangles using coordinates from an array

TriangleSphere

 A sphere mesh with uniform distributed vertices

Ops.Gl.Pbr


WebGl Ops

PbrEnvironmentLight

 PBR image based lighting setup

PbrMaterial

 PBR/Physical Based Rendering Material for realistic materials

Ops.Gl.Phong


WebGl Ops

Filter: All Material 

AmbientLight

 ambient light for phong material shading

DirectionalLight

 Directional light for phong shading

LambertMaterial

 a simple shaded material

PhongMaterial

 A shaded material for lighting objects

PointLight

 Point light for phong shading

ResetLights

 reset lights for everything triggered after

SpotLight

 spot light that emits a cone of light

Ops.Gl.Shader


WebGl Ops

Filter: All Material dataInfo 

AttributeAsColorMaterial

 render mesh normals as colors

BasicMaterial

 A material without shading

ChromaKeyMaterial

 display texture and replace a color with transparency

CustomShader

 Write your own custom shader

ErrorMaterial

draw meshes using the cables error material shader

FrontBacksideMaterial

 visualize which faces are facing the camera

GetShader

get current set shader

MatCapMaterialNew

 Easy to use image based lighting Material

Picker

 Test if the mouse hovers over drawn elements

PickingMaterial

 Test if following meshes are picked by the picker

PointMaterial

 Draw all vertices as points / circles

PositionAsColorMaterial

 draw meshes using XYZ position coordinates as RGB color

SetShader

Sets a shader

SetUniformFloat

 set a uniform value of the current shader

SetUniformTexture

 set a uniform value of the current shader

Shader2Texture

 render a shader into a texture

ShaderDefine

Set shader defines

ShaderInfo

view current shader source code

SwitchShader

Switch between two shaders

VertexColorMaterial

draw a mesh showing only it's vertex colors

VertexNumberMaterial

 visually debug vertices of your 3D geometry

WireframeMaterial

 Renders following meshes as wireframes

AreaDiscardPixel

 do not draw pixels inside a defined 3d area

AreaRotate

 rotate vertices in an area around a center point

AreaScaler

 Scales the size of meshes within the area of influence

AreaTranslateFBMNoise

 Translate object positions with a noise function

AreaTranslateMeshes

 Change the position of all meshes inside of the area of influence

Bend

 bend objects along an axis

ClampVertexPosition

 clamp/restrict the vertex position to min/max values per axis

ColorArea

 Colorize all meshes around current position

ColorizeInstancedMeshes

 colorize instanced meshes by picking random color from a texture

DeformArea

 deform a spherical area of a mesh

DiscardMaterialAlpha

 discard transparent pixels in material textures

ExplodeDividedMesh

 explode a (divided) mesh in the direction of faces normals

FogEffect

 Fog as a shadereffect applied to a material

FresnelGlow

 add fresnel glow to any material

InstancedDisplacementMap

 displace positions of instanced meshes using a texture

InstancedPerlinPosition

 displace position of instanced object by perlin noise value

InstancedTextureColorize

 colorize instanced meshes using a texture

LimitMeshByTexCoord

 discard pixel if texture coordinate is below threshold

MeshPixelNoise

 3d space noise for mesh materials

ModuloVertexPosition

 vertex shader modulo operation on vertex position

PerlinAreaDeform

 Displace vertices using perlin noise animation

Render2TexturesSlots

 select textures to render to

ScaleByNormal

 Scale vertices of an object in the direction of face normals

Shadow

 add shadow capabilities to any material

SplineDeform

 Deform a mesh along a spline

TextureProjection

 texture projection on meshes

TransformTextureCoordinates

 Transform and repeat texture coordinates of a mesh via vertex shader

TransformVertex

 transform vertices of a mesh via vertex shader

Twist

 twist a mesh around an axis

UseVertexColor

 Use vertex color as basecolor/diffuse color

VertexColorAsAlpha

 Use mesh vertexcolor as Alpha/Opacity

VertexDisplacementMap

 Displace the vertices of a mesh with the pixels brightness values from a texture

VertexNumberLimit

 only draw the first X vertices of a mesh

VertexPositionFromTexture

 set vertex positions of a mesh from a texture

VertexWobble

 sine wave vertex displacement

RgbeToFloat32Texture

 Convert a RGBE texture to HDR/floating point texture

Alpha

 Modify current alpha/opacity

AlphaMask

Set alphachannel of current imagecompose via a texture mask

BarrelDistortion

 Simulate fisheye effect

Blur

 Blur the pixels of an image

Border

 Draws a Border (rectangular frame) around the current ImageCompose

BrightnessContrast

 adjust image brightness and contrast

BulgePinch

 bulge and pinch an image (deform,stretch,distort)

CheckerBoard

 Draw a checkerboard pattern

ChromaticAberration

 simulating lens effect by shifting rgb channels

CircleTexture

 Draw 2d circle into texture

ClampTexture

 Clamps a texture to min and max values - Also has remap modes

Clarity

Increase contrast in midtones

ColorBalance

 change intensity of r,g,b channels

ColorChannel

enable disable RGB color channels

ColorMapRange

 Map the range of color number values to another

ColorMap

 colorize a black and white image using a gradient texture

Color

 fill image using a color (overlay)

Denoise

 Denoise texture effect - used to smooth out noisy images

DepthTextureFocus

 draws a gradient from white to black back to white over distance of the scene

DepthTexture

 draw the content of a depth texture

Desaturate

 Remove colors from image / greyscale

Dither

 convert color to black and white patterns

DrawImage

 Draws an image into a composition

EdgeDetection

 Draw only the edges of an image

Emboss

 Emboss / bevel effect

FXAA

 post processing antialiasing

FastBlur

Blurs a texture - cheap and fast

Flip

 flip the image on x or y axis

Float32ToRgbeTexture

 Convert a Float32 bit/HDR texture to RGBE format (only positive numbers)

Fog

 add post processing fog (nebula) to a scene

GammaCorrection

 Allows for Gamma correction of a texture

Gradient

 Draws a simple gradient between three colors

GridTexture

 Creates a grid texture

GrowPixels

 Make one pixel lines thicker via postprocessing

Hue

 Adjust Hue of current ImageCompose

ImageComposeAspectRatio

 Adjust aspect ratio of an image compose branch

ImageComposeSnapshot

 capture the current state of an imageCompose branch by copying the texture

ImageCompose

Compose Images and effects as layers to generate new Images

Interlace

 Tv scanlines effect

Invert

 Invert image colors

Kaleidoscope

 Kaleidoscope effect

LUTMap

 apply color filter/effects by using a lookup texture

LensDirt

 Creates a lens dirt like texture

LensScratches

 Creates a procedural texture simulating scratches on a lens

Levels

 adjust levels to correct the tonal range of an image

LumaKey

 Remove darkest or brightest parts of the image

Mirror

 mirroring image effect

MultiDrawImage

 draw multiple images at once

PatternLookup

 map a pattern to value levels of your texture

PixelColor

 fill image with one color picked at a position

PixelDifference

 visualize the difference of neighbouring pixels (slope)

PixelDisplacement

 Changes color lookup for every pixel using a displacement map

Pixelate

 Pixelate an image

Plasma

 Renders a plasma effect

PolarCoords

 display texture using polar/radial coordinate system

Posterize

 reduce number of colors

PseudoLensFlares

 simulate lens flare effect

RGBOffset

 Offsets the xy components of an RGB texture

RectangleTexture

 Draw a 2D rectangle with controllable parameters

RemoveAlpha

Remove alpha information from image

RepeatTexture

 Repeat Image

RgbMultiply

 multiply image colors by color channel

RgbToHsvTexture

 Convert a RGB Texture to Hue/Saturation/Lightness values as RGB colors

RotateTexture

 Rotates a texture

RoundCorners

 Draw round corners around image (border)

SSAO

 screen space ambient occlusion

ScaleTexture

 Scales a texture

ScrollTexture

 scroll image

Shapes2d

 Generates different 2d shapes to use as a texture

Sharpen

 Adjust image sharpness

SkewStretchImage

 skew / stretch an image by rendering scaled sides

Stripes

 Create a texture of stripes /lines

TexMathModulo

 modulo pixel color values

TextureDifference

render the difference of two textures

ToNormalMap

 Convert a black and white map to a normal map

Twirl

 Creates a twirl/swirl/spiral effect in a texture

Vibrance

 adjust vibrance/saturation

Vignette

 Simulating an old camera effect of fading away the edges of the image

WaveformGradient

 Generate different texture waveforms. Sine, sawtooth and triangle.

Waveform

 Generates 4 different waveform textures. Sine, sawtooth,Triangle, Square.

Wobble

 waving wobble motion effect

ZoomBlur

 Directional blur effect

RgbMath

 apply simple mathematical functions on pixels color values

RgbTransform

 transform RGB values interpreted as XYZ coordinates

CellularNoise

 cellular noise

FBMNoise

 fractional brownian motion noise

GlitchNoise

 Creates a black and white glitched texture to use for displacement

HexagonNoise

 Creates a hexagonal noise texture

LayerNoise

 Multilayer perlin noise variation

Noise

 White noise pixel effect

PerlinNoise

 Draw perlin noise into an image

PixelNoise

 Pixelated noise

PolkaDotNoise

 noise circles

SimplexNoise

 simplex noise generator

TriangleNoise

 noise made from triangles

ValueNoise

 value noise

Voronoise

 Voronoi Noise function

WorleyNoise

 Worley noise

Base64ToTexture

 Converts a base-64 image string into a texture

ColorTexture

Simple texture filled with one color

CombineTextures

 combine multiple textures into one by copying colorchannels

CopyTexture

 copy a texture and optionally resize it

EmptyTexture

A very simple empty texture

ExrTexture

 load .exr floating point texture files

GraphTexture

 draw a graph of a value into a texture

Histogram

 graphical representation of distribution of color in a texture

NoiseTexture

 Simple noisetexture

PaletteTexture

 Create a RGB color palette using an array

SwitchTextures

 Switch between different textures

TextTexture

 Generates a texture of Text using one of the font ops

TextureInfo

Outputs information about the connected texture

TextureSVG

 Load a SVG image and convert to a texture of pixels

TextureToBase64

 Converts a texture into a base-64 image string

TextureToCoordinateGrid

 convert a texture to a 3d coordinate grid storing coordinates in texture RGB channels

VideoTexture

 Play a video file and use it as a texture

WebcamTexture

 Use your webcam camera as a texture