Fragment,A modern toolkit for creative coding

Fragment lets you sketch, render, and export canvas-based graphics with ease, from quick experiments to production-ready visuals.

Features

  • Start instantly using built-in templates for Canvas 2D, p5.js, and three.js.
  • Generate live GUI controls directly from your sketch parameters.
  • Reload GLSL shaders on the fly.
  • Attach mouse, keyboard, and MIDI inputs directly from the interface or your code.
  • Organize your creative workspace with flexible window layouts.
  • Export your sketches as images or videos in standard formats.
  • Build static bundles ready for production deployment.

Specifications

  • Fast development and production builds powered by Vite

  • Interactive command-line interface on top of sade and clack

  • Video encoding in the browser with Mediabunny

  • TypeScript support

About

Fragment started as an idea in 2017 once I started extending the variety of my practices from web development to real-time graphics and generative art.
Over the years, it grew from a personal workflow into a fully fledged environment, designed around sketches, live inputs, and instant exports.
I released it publicly in 2022, and I’ve used it on a daily basis ever since.

Read the full story

Support

If you enjoy using Fragment and want to help it keep growing, consider supporting the project. Even a small contribution helps maintain, improve, and expand it for everyone.

Become a sponsor

Thank you,
Raphaël