gd4_p5cs
gd4_p5cs is a p5.js-inspired creative-coding layer for Godot 4. It lets you write visual sketches in either GDScript or C# without touching scenes, shaders, or the Godot editor’s drawing pipeline directly. The goal is fast iteration: write a few lines, save, and see the result immediately.
The name reflects the stack: Godot 4 + p5 + cs (C# support).
The project is based on adcomp/Godot4_p5 and extends it with C# support, hot-reloading, a runtime sketch selector, and a broader API.
Why
p5.js is popular for generative art and creative prototyping because the barrier to entry is nearly zero - setup(), draw(), done. Godot is a capable 2D/3D engine, but turning it into a canvas for quick visual experiments requires boilerplate. gd4_p5cs removes that boilerplate and maps the p5.js mental model onto Godot’s rendering layer.
C# extends this further - when a sketch grows beyond quick prototyping, the .NET ecosystem is available without leaving the same API.
Features
- GDScript and C# sketches - both languages are fully supported and interchangeable
- Hot-reloading - GDScript sketches reload on file save; C# sketches reload after assembly rebuild
- Runtime sketch selector - pick any sketch from the
sketch/folder without restarting - Built-in UI - pause, restart, screenshot, and color picker buttons
- p5.js-style API -
setup(),draw(),background(),fill(),stroke(), and the full shape set - Transform stack -
push()/pop()saves and restores both transform and style state - Math helpers -
map,lerp,noise(1D/2D/3D),random,randomGaussian, and more - Input - mouse position, buttons, keyboard, and event callbacks
- Text and images -
text(),textSize(),loadImage(),image()
Getting Started
Clone or download the repository and open the project in Godot 4.5+ with .NET support enabled. Press Run. The demo scene loads and the sketch selector appears.
Writing a GDScript sketch
Create a .gd file inside sketch/ (or anywhere else where you can find it) that extends godotp5_class:
extends godotp5_class
func setup():
createCanvas(800, 800)
func _draw():
background(Color.BLACK)
fill(Color.WHITE)
circle(width / 2, height / 2, 100)
Writing a C# sketch
Create a .cs file inside sketch/ that extends GodotP5:
using Godot;
public partial class MySketch : GodotP5
{
public override void Setup()
{
CreateCanvas(800, 800);
}
public override void DrawSketch()
{
Background(new Color(0, 0, 0));
Fill(new Color(1, 1, 1));
Circle(Width / 2, Height / 2, 100);
}
}
The sketch is picked up automatically by the selector - no scene wiring needed.
API Overview
The API mirrors p5.js conventions. GDScript uses snake_case; C# uses PascalCase.
Shapes: circle, ellipse, arc, rect, square, triangle, quad, line, point, bezier, beginShape / vertex / endShape
Style: fill, noFill, stroke, noStroke, strokeWeight, background, smooth, noSmooth
Transforms: push / pop, translate, rotate, scale, resetMatrix
Math: map, constrain, lerp, dist, mag, norm, sq, degrees, radians, random, randomGaussian, noise (1D/2D/3D), noiseSeed
Color: lerpColor, red, green, blue, alpha
Input: mouseX/Y, pmouseX/Y, movedX/Y, mouseIsPressed, mouseButton, keyIsPressed, key, keyCode - plus overridable callbacks mousePressed(), mouseClicked(), mouseReleased(), mouseMoved(), mouseDragged(), keyPressed(), keyReleased()
Time: hour(), minute(), second(), day(), month(), year(), millis(), frameCount, deltaTime
Canvas: createCanvas(w, h), loop(), noLoop(), pause(), restart(), frameRate(fps)
Text & images: text(str, x, y), textSize(n), textAlign(h), loadImage(path), image(tex, x, y)
Full API tables are in the README.
Included Sketches
The sketch/ folder ships with ~20 examples:
| Sketch | Description |
|---|---|
AdditiveWaves | Additive wave synthesis (Coding Train #30) |
Clock | Animated analog clock face |
Phyllotaxis | Golden angle / Fibonacci spiral |
spirograph | Spirograph mathematical visualization |
noise_circle_grid | Grid of circles driven by FastNoise |
blobby | Animated blob using rotated vectors |
circle_dance | Dancing circles with trig functions |
wrap_node | Wrapping particles with proximity connections |
draw_with_mouse | Freehand mouse drawing |
Gametest (C#) | Interactive note-matching game |
empty_sketch | Blank template for new sketches |
Status
Core drawing and control APIs are stable. C# support covers the most commonly used features. Hot-reload for C# is functional but still experimental - it lives on the cs-hotreload branch and requires an assembly rebuild while the project is running. This happens automatically and doesn’t require restarting the game but there might still be some issues with it, which i have not discovered yet.
Future plans
In the future i might implement loading p5.js files themselves. This is a huge uptaking as it probably requires translating the files into .gd or .cs files. Loading p5.js files in Godot is theoretically already possible over the JavaScriptBridge singleton but i am actually not sure how well that works.
Repository
github.com/Toemmsen96/gd4_p5cs
Credits
- adcomp - original Godot4_p5 base
- Toemmsen96 - C# support, hot-reload, sketch selector, extended API