p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Processing. http://twitter.com/p5xjs
lmccart Merge pull request #3220 from limzykenneth/master
p5.XML implementation rework and httpPost support for p5.XML
Latest commit 7bd5ea1 Oct 6, 2018


Build Status npm version


Hello! p5.js is a JavaScript library that starts with the original goal of Processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets this for today's web.

Using the original metaphor of a software sketchbook, p5.js has a full set of drawing functionality. However, you're not limited to your drawing canvas, you can think of your whole browser page as your sketch! For this, p5.js has addon libraries that make it easy to interact with other HTML5 objects, including text, input, video, webcam, and sound.

p5.js is a new interpretation, not an emulation or port, and it is in active development. An official editing environment is coming soon, as well as many more features!

If you already know the basics of JavaScript or Processing, the p5.js overview wiki page is a good place to start.

If you have found a bug in the p5.js library, you can file it here under the “issues” tab. An indicative template for reporting an issue is provided to assist you (and us!) better.

p5.js library

To use the complete p5.js library, you can download it here. If you are interested in the most recent, less stable version, or even simply in (new!) certain components of p5.js, you can clone this repository and run grunt from the command line to generate the library from source. See the developer docs for more information about our build process to generate the complete as well as selective library.

You can also start with the codepen template. You may need to update the version of the p5.js library that is linked into the html section.

Community maintained typescript definitions are here.


Please post bugs in the correct repository:


Check out p5js.org for lots more! Here are some quick-links:

  • Get Started: Create and run your first sketch!
  • p5.js overview — An overview of the main features and functionality of p5.js.
  • Reference: The functionality supported by p5.js.
  • Learn: Tutorials and short, prototypical examples exploring the basics of p5.js.
  • Forum: Ask and answers questions about how to make things with p5.js here.
  • Libraries: Extend p5 functionality to interact with HTML, manipulate sound, and more!

Get Involved

p5.js is a collaborative project created by many individuals, and you are invited to help. All types of involvement are welcome. See the community section to get started!

Developers, check out the developer docs for more in-depth details about contributing code, bug fixes, and documentation.


Lauren McCarthy

Jason Sigal


Evelyn Eastmond

Daniel Shiffman

Casey Reas

Ben Fry

Kenneth Lim

🐛 💻 📖

kate hollenbach

Stalgia Grigg

Jerel Johnson

Saksham Saxena

saber khan

Daniel Howe

Kevin Siwoff

Atul Varma

Jess Klein

uno seis tres

susan evans

Saskia Freeke

Phoenix Perry

jesse cahn-thompson

Lee T

Chelly Jin



Maya Man

Tega Brain


AlM Chng

aarón montoya-moraga

Cassie Tarakajian

Niklas Peters


Mathura MG

Yining Shi

Jen Kagan

Jiashan Wu

Marc Abbey

K.Adam White

Joe Cridge

Michael Hadley

Todd H. Page

Jared Sprague

💻 📖 💡 💵 ⚠️ 🐛

evelyn masso

Blaize Kaye

Sanchit Kapoor

Oliver Wright

Matthew Kaney


Claire K-V

R. Luke DuBois

Kevin Barabash


Bob Holt

Sarah Groff Hennigh-Palermo

Jordan Shaw


Derek J. Kinsman

harkirat singh


Max Goldstein

XY Feng

Sparsh Paliwal

Austin Cawley-Edwards

📖 💡


Yannick Assogba

John Pasquarello


Kevin Workman


David Wicks

Guillermo Montecinos

Shawn Van Every

Sinan Ascioglu

Abe Pazos


Gene Kogan

Jason Mandel

Mark Russo

Jonathan Dahan

Darius Morawiec

Darby Rathbone


Chiun Hau You

Francesco Bigiarini

Fabian Morón Zirfas

Mike Anderson

Mikael Lindqvist


Max Segal

Tyler Stefanich


Xavier Snelgrove

Gareth Battensby

Taeyoon Choi


Kevin Ho

Harsh Agrawal

Luca Damasco

Sam Lavigne

Epic Jefferson

Caroline Record

Christine de Carteret

Chris Hallberg

David Newbury


Paolo Pedercini

Jason Alderman

Jennifer Jacobs

Sepand Ansari

Val Head

Emily Chen

Ben Moren

Rune Skjoldborg Madsen

Scott Murray

Scott Garner


Craig Pickard


Zach Rispoli

Liu Chang

Cristóbal Valenzuela

Miles Peyton

Golan Levin


Chiciuc Nicușor

Ken Miller

Chandler McWilliams

Jaymz Rhime

Niels Joubert

Utkarsh Tiwari

Arihant Parsoya

Brad Buchanan

Johan Karlsson

Andy Timmons


Brian Boucheron


Kyle McDonald

Antonio Jesús Sánchez Padial

Brad Smith

Vítor Galvão

Devon Rifkin

Emily Xie

Boris Bucha

Petr Brzek


Arsenije Savic

Luke Burgess-Yeo

Sun Lifei


Jimish Fotariya

Jorge Moreno

🐛 💻 📖

Steven Green

Marcus Parsons

Nick Yahnke

Anthony Su

kroko / Reinis Adovičs

Robyn Overstreet

Ben Hinchley

Max Kolyanov

Zeno Zeng



Lionel Ringenbach

Harshil Goel

Joshua Storm Becker



Alejandra Trejo

Prashant Gupta

Kai-han Chang



Christopher Coleman




Jay Gupta

Nitish Bansal

Caroline Hermans

💡 📖

Faith Wuyue Yu

Aatish Bhatia

📖 🐛

Mislav Milicevic

💻 🐛

Yuting Lu


Adil Rabbani

💻 🐛 💡

Pierre Krafft

🐛 💻 📖 💡 👀 ⚠️ 🔧

Zoë Ingram


Aidan Nelson

🐛 💻 📖

Cameron Yick


Tanvi Kumar

🐛 💻 📖 💡

Katsuya Endoh

Thanks goes to these wonderful people (emoji key)!

We recognize all types of contributions. This project follows the all-contributors specification. Instructions to add yourself or add contribution emojis to your name are here.