fragment

Examples

Discover what Fragment can do through simple examples.

Canvas 2D - Shape

A 2D canvas sketch that draws a single centered shape—circle or square—with adjustable size, fill color, and background.

A yellow circle on a blue background with Fragment controls in the top right

Source code Demo

p5.js - Grid

A p5.js sketch that builds a grid of squares whose colors and layout can be randomized with a single control.

A 2D grid made of red, green, and black squares of different sizes on a white background

Source code Demo

p5.js - Shader

A p5.js WebGL sketch that draws a full-screen shader using animated noise and a shifting color palette.

Noise pattern colorized with a gradient going from blue to brown

Source code Demo

three.js - WebGL Cube

A three.js scene with a rotating cube, adjustable color/position/speed, interactive camera controls, and optional spotlight debug helpers.Based on three.js perspective template

A green cube on top of a grid floor with Fragment controls in the top right

Source code Demo