Topics / #creative-coding

Creative-coding projects on GitHub

Programming for artistic and visual expression, including generative graphics frameworks.

As of , the most-starred Creative-coding projects on GitHub are particles.js (30.2K stars), Graphite (27.6K stars) and p5.js (24.1K stars). GitHub.Locker tracks 55 Creative-coding repositories with 394.7K stars combined. The fastest-growing on October 16 was lemo-opuscar, with +246 stars in a day.

55Projects
394.7KStars in total
+1.1KStars in a day

Hot right now

Most stars gained in a day · Oct 16

The all-time top

55 projects · by stars

  1. #1 · VincentGarreau/particles.js

    particles.js

    A lightweight JavaScript library for creating particles: you add it to a web page to get animated, interactive particle backgrounds and effects.

    30.2K
  2. #2 · GraphiteEditor/Graphite

    Graphite

    Graphite is a free, open source 2D graphics editor for graphic design, digital art, and real-time motion graphics — a vector and raster graphics engine, available now in alpha.

    27.6K
  3. #3 · processing/p5.js

    p5.js

    p5.js is a free, open-source JavaScript library for creative coding, letting artists, designers, educators, and beginners draw graphics, sound, and interactive work directly on a web page.

    24.1K
  1. 4

    rough

    21.3Krough-stuff/rough · HTML

    Rough.js is a small (<9 kB) JavaScript graphics library that makes drawings look sketchy and hand-drawn instead of clean and geometric.

  2. 5

    motion-canvas

    19.4Kmotion-canvas/motion-canvas · TypeScript

    Motion Canvas is a free, open-source tool for creating informative vector animations — you program them in TypeScript and watch them in a real-time preview editor, optionally synchronized with a voice-over.

  3. 6

    multipleWindow3dScene

    18.9Kbgstaal/multipleWindow3dScene · JavaScript

    A small demo showing how to keep a single 3D scene visually continuous across multiple separate browser windows, using Three.js for rendering and localStorage to sync window positions and state.

  4. 7

    mojs

    18.8Kmojs/mojs · CoffeeScript

    mo.js is an open source JavaScript motion graphics library for the web — fast, retina ready and modular. Using it on a site enhances the user experience and enriches content visually with precise, delightful animations.

  5. 8

    matter-js

    18.5Kliabru/matter-js · JavaScript

    Matter.js is a JavaScript 2D rigid body physics engine for the web — a physics simulation you drop into web pages and Node.js apps.

  6. 9

    WebGL-Fluid-Simulation

    16.7KPavelDoGreat/WebGL-Fluid-Simulation · JavaScript

    It is an interactive WebGL demo that simulates fluid dynamics in real time, letting you swirl colorful liquid-like effects with your mouse or finger directly in the browser.

  7. 10

    awesome-creative-coding

    15.4Kterkelg/awesome-creative-coding · HTML

    A curated list of resources for creative coding - generative art, data visualization, and interaction design - covering books, courses, frameworks, shader tutorials, and communities.

  8. 11

    paper.js

    15.1Kpaperjs/paper.js · JavaScript

    Paper.js is an open-source vector graphics scripting framework for JavaScript, running in the browser on top of the HTML5 Canvas element. It is a JavaScript/browser port of Scriptographer, the original scripting plugin for Adobe Illustrator, built by the same authors.

  9. 12

    prettymaps

    14.3Kmarceloprates/prettymaps · Python

    prettymaps is a Python library that draws stylized, artistic maps from OpenStreetMap data, combining osmnx, matplotlib, shapely and vsketch to render streets, buildings, water and other features as a custom-styled figure.

  10. 13

    primitive

    13.5Kfogleman/primitive · Go

    It recreates a target image out of geometric primitives: the algorithm keeps adding one shape at a time, each chosen to minimize the difference from the original, until the result is recognizable yet artistic and abstract.

  11. 14

    theatre

    12.8Ktheatre-js/theatre · TypeScript

    Theatre.js is an animation library for high-fidelity motion graphics on the web. It is designed for detailed animation — intricate movement and nuance — and can be used both programmatically and visually.

  12. 15

    sonic-pi

    12.2Ksonic-pi-net/sonic-pi · C++

    Sonic Pi is a free, open source programming environment where you write and live-edit code to create and perform music, originally built to teach coding in schools but now also used by professional artists and DJs for live performances.

  13. 16

    a-picture-is-worth-a-1000-words

    11.4Kgirliemac/a-picture-is-worth-a-1000-words

    A personal collection of hand-drawn and digital tech doodles and sketchnotes explaining complex tech concepts (algorithms, web dev, machine learning, git, generative AI) in simple pictures.

  14. 17

    videos

    11.4K3b1b/videos · Python

    This is the source code behind 3Blue1Brown's math explainer videos: the Python scenes, built with the manim animation library, that generate the actual visuals seen in the videos.

  15. 18

    zdog

    10.7Kmetafizzy/zdog · JavaScript

    Zdog is a round, flat, designer-friendly pseudo-3D engine for the web: you build 3D models in JavaScript by adding shapes, and it renders them with 2D drawing APIs to canvas or SVG.

  16. 19

    openFrameworks

    10.4Kopenframeworks/openFrameworks · C++

    It's a community-developed, cross-platform toolkit for creative coding in C++ — you use it to build interactive graphics, audio, video and computer-vision projects.

  17. 20

    leonsans

    10.2Kcmiscm/leonsans · JavaScript

    Leon Sans is a geometric sans-serif typeface that is generated with code instead of being a static font file, letting you render and animate it in the HTML5 Canvas element.

  18. 21

    trianglify

    10.1Kqrohlf/trianglify · JavaScript

    Trianglify is a JavaScript library that algorithmically generates colorful triangle-mesh background images as SVG — decorative low-poly-style patterns you can drop into a web page.

  19. 22

    vectorcraft

    9.5Kstorytold/vectorcraft · Rust

    VectorCraft is an open-source, clean-room reimplementation of Adobe Illustrator, built from scratch in pure Rust, aiming to replicate Illustrator's tools, panels and workflow.

  20. 23

    awesome-opus5-5-videos

    5.6Kyihui-dev/awesome-opus5-5-videos

    A curated, growing collection of viral videos made with Claude Opus 5.5, each paired with the exact prompt its creator shared and a link to the original post.

  21. 24

    canvas-ui

    5KDavidHDev/canvas-ui · TypeScript

    Canvas UI is an open-source library of creative canvas components for building live, interactive web effects. Each component draws fluid simulations, shader effects, or 3D scenes directly over your real, still-clickable HTML.

  22. 25

    huashu-art-motion

    4.2Kalchaincyf/huashu-art-motion · JavaScript

    huashu-art-motion is an agent skill that turns a coding agent into an animator: it writes and runs JavaScript/Canvas code to produce art-style animations, rather than generating video frames directly.

  23. 26

    scroll-craft

    3.6Knateherkai/scroll-craft · JavaScript

    scroll-craft is an agent skill that teaches coding agents like Codex or Claude Code how to build premium, scroll-driven immersive websites to a consistent design standard, bundling a design workflow, reference docs, an animation engine, and verification tools.

  24. 27

    mono-color-skill

    3.4Kyanliudesign/mono-color-skill · Python

    A one-ink and controlled two-ink editorial image skill for posters, zines, portraits, packaging, and visual field notes — it turns a theme, sentence, object, or supplied photo into an original editorial-style image.

  25. 28

    pdoom-video

    2.8Kmexicat/pdoom-video · TypeScript

    A generative, code-rendered music video for the song 'I'm Upping My P(doom)' with word-synced karaoke-style typography, where every frame is a deterministic function of song time.

  26. 29

    lemo-opuscar

    2.8Klemomo-ai/lemo-opuscar · JavaScript

    Lemo-Opuscar is a Claude Code skill that lets Claude Opus 5.5 direct, draw, score and mix short films entirely in code, with 43 ready-made film styles you can apply to your own story.

  27. 30

    PDoomVideo

    2.2KJohnHeibel/PDoomVideo · JavaScript

    The source code behind 'I'm Upping My P(doom)', a music video generated entirely by Claude Opus 5.5 in Claude Code — every scene, character and transition came from the model, not a human animator.

  28. 31

    score

    2.1Kossia/score · C++

    ossia score is a sequencer for audio-visual artists, designed to create interactive shows.

  29. 32

    ClaudeAnimationBase

    1.2KJohnHeibel/ClaudeAnimationBase · JavaScript

    A starter kit of code, prompts and assets for making Claude (via Claude Code or another coding agent) animate a hand-painted-style cartoon character called Clawd using p5.js and the p5.brush library, rendering the result as an MP4.

  30. 33

    motion-video-kit

    1.1Kechris6/motion-video-kit · Python

    A Claude Code skill kit (also usable as plain context for any LLM) that packages the process for making premium, launch-style AI business videos — a critic loop, motion grammar, quality checks, audio rules, a business playbook and Three.js patterns, drawn from studying 28 professional SaaS launch films.

  31. 34

    mg-styles-15

    960Vincentwei1021/mg-styles-15 · Python

    A collection of 15 ten-second motion-design films, each in a different visual style, all made by Claude Opus 5.5 writing code from a single text prompt. The repo publishes every film along with its style notes, full prompt and complete source code.

  32. 35

    ascii

    893bas3line/ascii · TypeScript

    ascii is a TypeScript library of 216 animated ASCII art pieces for web pages, usable in React, Next.js, Astro, plain HTML, terminals, and GitHub READMEs.

  33. 36

    orb

    733LerSent001/orb · TypeScript

    Liquid Orb Editor is a real-time editor for creating animated liquid-glass orb effects, built with React and WebGPU/WGSL. You tweak color, speed, shape, glass refraction and glow, then export the result as a standalone web page or as SwiftUI/Metal code for iOS apps.

  34. 37

    world-execute-me-dsh-pv

    576MisakaZentai/world-execute-me-dsh-pv · Python

    The complete source code of an unofficial fan PV (music video) for Mili's song 'world.execute(me);', where every frame is generated by code as a function of song time. The left half shows a DeepSeek Harness (dsh) chat window, the right half a TUI visualization of the model's world.

  35. 38

    threejs-architecture-effects

    568lhlGitHub/threejs-architecture-effects · TypeScript

    This is an Agent Skill for Codex, Claude Code, and Cursor that builds a real, orbitable Three.js building which assembles itself on a timeline — brick courses, timber frame, dougong brackets, layered eaves, and procedural PBR materials — without needing a paid 3D model or an API key.

  36. 39

    Viscose-carousel

    515Yousuf-developer/Viscose-carousel · JavaScript

    Viscose is a portfolio carousel rendered entirely as a single WebGL fragment shader. Cards sit on a ring that's mostly off-screen; as they come together they melt into each other like liquid, and as they pull apart they draw thin threads between them.

  37. 40

    procedural-film

    511kuhnhomeuk-cell/procedural-film · JavaScript

    An agent skill that turns a topic into a 30-second vertical film, with every pixel drawn in vanilla JavaScript on a canvas and every sound synthesised with Web Audio, so no stock footage or audio files are used. It outputs a self-contained HTML player plus MP4 exports.

  38. 41

    grok-icon-study

    365blessonism/grok-icon-study · JavaScript

    An unofficial study replica of the character animation on the Grok Bot.app v0.18.0 login page — a spring-driven character engine rebuilt for learning how its state machine, spring motion and polygon eyes work.

  39. 42

    sylva

    348MengTo/sylva · HTML

    Sylva is an interactive Three.js landscape study: a procedural, moss-covered root grows through an editorial conservation scene and reacts to the pointer as if it were alive.

  40. 43

    riso-windowseat

    297sevenevesai/riso-windowseat · HTML

    Procedural risograph-style animated films, each a single self-contained HTML file of Canvas 2D and Web Audio, plus the Claude Code skills, craft docs and tools used to make them.

  41. 44

    natural-disasters

    287Token-Gremlin/natural-disasters · JavaScript

    ABYSSAL is a fully procedural cinematic ocean and extreme-weather simulation that runs entirely in a browser tab, rendering multi-cascade FFT ocean waves, volumetric clouds, hurricanes and tsunamis with zero external assets, built on Three.js, WebGL2 and GLSL3.

  42. 45

    Infinite

    279n1m21n/Infinite · C++

    Infinite is a free, open-source node-based audiovisual workstation that combines real-time GPU video/3D compositing with a modular synthesizer rack and native plugin hosting, all wired together in one patch.

  43. 46

    VibeGame

    272tettethu/VibeGame · Python

    VibeGame is an open-source, self-evolving multi-agent framework with an AI-native game engine that turns natural-language prompts into playable 2D web games, which you can then edit however you like. It runs on top of Claude Code and OpenAI Codex agent runtimes.

  44. 47

    dioramas

    256blendi-remade/dioramas · JavaScript

    Dioramas is a free, open-source framework for building cinematic, interactive 3D websites where the 3D scene itself is the page — a detailed object, real lighting, a choreographed camera, and one touchable interaction. It ships with 20 complete example sites built using it.

  45. 48

    saas-motion-kit

    238tugrawork-creator/saas-motion-kit · Python

    A production kit for making promo and motion videos for software products with HyperFrames and Claude Code, built around one rule: no two films should look the same. It gives you a 7-stage playbook, a 24-transition atlas, 100 storyboard themes and a variety-audit script that flags repeated effects before you build.

  46. 49

    LinearAbilityExtThreeJS

    214achrefelouafi/LinearAbilityExtThreeJS · JavaScript

    Elemental Sandbox is a skillshot VFX sandbox built with Three.js, Vite and hand-written GLSL, where you arm one of seven elemental abilities, aim it, and fire it with the mouse to watch procedurally generated fire, water, electricity and stone effects play out.

  47. 50

    procedural-sounds

    199m1ckc3s/procedural-sounds · TypeScript

    Procedural Sounds generates interface and UI sounds live in the browser from code recipes instead of audio files, so you design a sound by ear and then export it.

  48. 51

    cbirds

    190clainstone/cbirds · C

    cbirds is a terminal toy that simulates Craig Reynolds' boids - a flock of birds flying around your terminal, drawn in braille by default or as real sprites in Kitty/Ghostty via the Kitty graphics protocol.

  49. 52

    kool-brushez

    185blakeshao/kool-brushez · JavaScript

    A small p5.js drawing app with six expressive brushes (Score, Schematic, Balloon, Subway, Crowd, Gunpla) that all draw onto one shared canvas.

  50. 53

    kindergrimm

    171albertobeiz/kindergrimm · JavaScript

    A procedural generator that draws hand-sketched doodle characters directly on canvas, rigs each one bone-by-bone for animation, and wraps them into several small browser games and tools under the name Kindergrimm.

  51. 54

    genart-skill

    152camilleroux/genart-skill · JavaScript

    genart is a Claude Code plugin that teaches Claude the technical and ethical groundwork of generative art — seeding a PRNG from a token hash, deterministic rendering, trait and rarity design — and ships scripts to verify a sketch is actually deterministic before you mint it onchain.

  52. 55

    astra-chatgpt-hyperframes

    141Tejashmakwana/astra-chatgpt-hyperframes · JavaScript

    This is the reproducible source for a ChatGPT-themed motion-design video, adapted from motion designer Rajmoni's (@Nexaabyraj) original reference and rendered with Hyperframes. It ships the raw assets, render scripts and a verification report so anyone can rebuild the exact MP4.

Often tagged together