Tour

Art that runs. Code you can touch.

Creative Code Art is a free home for artists who paint with code. Everything on this page is live, running in your browser right now. Move, scroll, and try it yourself.

Start the tour ↓

01 · Write

Change a number. Watch it change.

This is a real p5.js sketch. Edit the numbers at the top: petals, layers, hue, speed. The picture redraws a moment after you stop typing. No account, nothing saved.

// Change these numbers and watch the picture follow.
let petals = 7;    // try 3, 12 or 24
let layers = 18;   // how many rings
let hue = 32;      // 0-360: try 180 for teal
let speed = 1;     // 0 stops it

function setup() {
  createCanvas(600, 600);
  colorMode(HSB, 360, 100, 100, 1);
  noFill();
}

function draw() {
  background(220, 30, 6, 0.2);
  translate(width / 2, height / 2);
  const t = frameCount * 0.01 * speed;
  for (let i = 0; i < layers; i++) {
    const r = 36 + i * 13;
    stroke((hue + i * 7) % 360, 70, 100, 0.6);
    strokeWeight(1.4);
    beginShape();
    for (let a = 0; a <= TWO_PI + 0.05; a += 0.03) {
      const wave = sin(a * petals + t * 2 + i * 0.35) * (6 + i * 1.3);
      vertex((r + wave) * cos(a), (r + wave) * sin(a));
    }
    endShape();
  }
}

Try petals = 3, or hue = 180.

02 · Play

Sliders let anyone play

Artists choose which numbers visitors may move. Drag these and the flow field answers at once, without reloading. On every work page, sliders work the same way.

Particles1600

Curl1.2

Trails0.85

03 · Choose

Four ways to paint

Pick the tool that fits the idea. Each of these is the starting sketch an artist gets.

p5.js

The friendly classic: setup() and draw(), shapes and colour. Perfect for a first sketch.

GLSL shader

Shaders run on the graphics card, every pixel at once: light, fluid, noise.

three.js

3D scenes with lights, materials and a camera people can turn.

Canvas JS

Plain JavaScript and a 2D canvas, nothing in between.

04 · Remix

Remix, and the credit follows

When an artist allows it, anyone can copy a work in one click and make it their own. The remix always names the original, and every work shows its whole remix family.

A remix family: every branch leads back to the original.

05 · Show

A page that is yours

Your name, your photo, a cover made from one of your own works, your tools and links, and every work running live. One short address to share everywhere.

A real page, live from the site · Visit the page →

06 · Together

Festivals, challenges, workshops

Since 2020 the community has run a festival in virtual reality, a week with Ars Electronica, live shows in New York and Bogotá, prompt challenges and free workshops.

See all projects

07 · Trust

What we promise

Free for every artist

Pages, works, remixes and community cost nothing.

Credit stays with the maker

Every remix links back to the original, forever.

Locked sandbox

Code runs walled off: no network, no cookies, no access to your account.

Private by default

No ads, no trackers, and your data is never sold.

Your first work is a click away

Make your page, write a few lines, and the world sees them run.

Create my page Explore works