# Creative Code (https://docs.fuser.studio/docs/creative-code)

Creative Code is a node on the canvas where you describe a sketch in natural language or write JavaScript directly, and Fuser runs it as a live, interactive visual right there in your flow. Reach for it when you want **interactive or moving visuals** — animations, generative artwork, particle systems, data-driven graphics, things that respond to the mouse or to input from another node. If you've heard of [p5.js](https://p5js.org/) or [Three.js](https://threejs.org/), Creative Code wraps both of them along with raw HTML5 Canvas.

The same node has two ways in:

* **prompt mode** — describe what you want; an LLM streams the sketch into the editor.
* **code mode** — open the editor and write or edit JavaScript directly.

You'll bounce between them. Most sessions start with a prompt to scaffold the idea, drop into code mode to tighten behavior, and back to prompt mode for the next big move. Both modes produce the same artifact: a running sketch on the canvas, recordable, publishable, and connected to the rest of your flow.

> [!NOTE] When to reach for Creative Code
>
> Pick Creative Code when the output should **react to something** (mouse, time, an input value), should **animate**, or should be made from **rules and code** rather than a single AI inference. Pick a regular generation node (Flux, Veo, etc.) when you want a one-shot still image or video from a prompt — Creative Code isn't a faster way to generate AI images, it's a different surface for things AI generators don't do well.

## What it produces [#what-it-produces]

A running sketch is a live node like any other. You can:

* **Save** a frame as a **Photo**, or record up to two minutes as a **Video** — both become regular Image or Video nodes downstream.
* **Publish** the current version to a public `/embed/cc/:id` URL anyone can drop in an iframe.
* Wire `@fuser-params` to upstream nodes so other parts of your flow drive the sketch.

See [Saving and sharing](https://docs.fuser.studio/docs/creative-code/publishing-and-export.md) for the full export and embed story.

## What's Next? [#whats-next]

  - [Prompting and chat](https://docs.fuser.studio/docs/creative-code/prompting.md): Drive the node from natural language. Prompt panel, chat history, model picker.

  - [Editing code by hand](https://docs.fuser.studio/docs/creative-code/editor.md): The Creative Code editor — opening it, line-diff highlights, Explain this line.

  - [Parameters and inputs](https://docs.fuser.studio/docs/creative-code/parameters-and-attachments.md): Declare tunable parameters and pull image, video, audio, and mesh data from upstream nodes.

  - [How sketches run](https://docs.fuser.studio/docs/creative-code/runtime.md): Supported libraries, the lifecycle, and what's blocked.

  - [Saving and sharing](https://docs.fuser.studio/docs/creative-code/publishing-and-export.md): Capture stills, record video, save versions, and publish public embeds.