p5.js

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.

Issues

Please post bugs in the correct repository:

• p5.js general and p5.dom: https://github.com/processing/p5.js/issues
• p5.sound: https://github.com/processing/p5.js-sound/issues
• p5.js website: https://github.com/processing/p5.js-website/issues
• p5.js web editor: https://github.com/processing/p5.js-web-editor/issues

Learning

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.

Contributors

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.

Lauren McCarthy	Jason Sigal	Karen	Shahriar Rahman Rubayet	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	L05	DIYgirls	lam802
Maya Man	Tega Brain	luisaph	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	Spongman	Claire K-V	R. Luke DuBois	Kevin Barabash	codeanticode	Bob Holt
Sarah Groff Hennigh-Palermo	Jordan Shaw	brightredchilli	Derek J. Kinsman	harkirat singh	GoToLoop	Max Goldstein
XY Feng	Sparsh Paliwal	Austin Cawley-Edwards 📖 💡	taseenb	Yannick Assogba	John Pasquarello 💻	Kevin Workman
gauini	David Wicks	Guillermo Montecinos	Shawn Van Every	Sinan Ascioglu	Abe Pazos	Char
Gene Kogan	Jason Mandel	Mark Russo	Jonathan Dahan	Darius Morawiec	Darby Rathbone	hrishit
Chiun Hau You	Francesco Bigiarini	Fabian Morón Zirfas	Mike Anderson	Mikael Lindqvist	Chris	Max Segal
Tyler Stefanich	Dave	Xavier Snelgrove	Gareth Battensby	Taeyoon Choi	AKASH RAJ	Kevin Ho
Harsh Agrawal	Luca Damasco	Sam Lavigne	Epic Jefferson	Caroline Record	Christine de Carteret	Chris Hallberg
David Newbury	piinthecloud	Paolo Pedercini	Jason Alderman	Jennifer Jacobs	Sepand Ansari	Val Head
Emily Chen	Ben Moren	Rune Skjoldborg Madsen	Scott Murray	Scott Garner	b2renger	Craig Pickard
mxchelle	Zach Rispoli	Liu Chang	Cristóbal Valenzuela	Miles Peyton	Golan Levin	feedzh
Chiciuc Nicușor	Ken Miller	Chandler McWilliams	Jaymz Rhime	Niels Joubert	Utkarsh Tiwari	Arihant Parsoya
Brad Buchanan	Johan Karlsson	Andy Timmons	zacharystenger	Brian Boucheron	sortasleepy	Kyle McDonald
Antonio Jesús Sánchez Padial 💻	Brad Smith	Vítor Galvão	Devon Rifkin	Emily Xie	Boris Bucha	Petr Brzek
Ramin	Arsenije Savic	Luke Burgess-Yeo	Sun Lifei	naoyashiga	Jimish Fotariya	Jorge Moreno 🐛 💻 📖
Steven Green	Marcus Parsons	Nick Yahnke	Anthony Su	kroko / Reinis Adovičs	Robyn Overstreet	Ben Hinchley
Max Kolyanov	Zeno Zeng	Seth	plural	Lionel Ringenbach	Harshil Goel	Joshua Storm Becker
maxdevjs	trych	Alejandra Trejo	Prashant Gupta	Kai-han Chang	kjav	maddy
Christopher Coleman	Boaz	Yasai 📝	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	Kevin Bradley 📖	Justin Kim 📖	Federico Grandi 💻 📖	Freddie Rawlins 💻 📖
Luc de wit 💻 🐛	Mark Nikora 💻	Louis Demange 🐛	Sanket Singh 💻 🐛 📖 💡	Oren Shoham 💻	Abhinav Sagar 💻	Jonathan Heindl 💻 💡 🤔 📖
Hirad Sab 💻 🐛 📖 💡	Vishal Singh 📖 💻	Corey Gouker 💻 📖 🐛	Lisa Mabley 📖 💡	Adam Ferriss 💻 📖 🐛 💡	Joshua Marris 📖 💻 📢 ✅	Erica Pramer 📖
Vasu Goel 💻 ⚠️	Tokini Irene Fubara 📖	Dhruv Sahnan 💻 📖	Jon Kaufman 📖	Nico Finkernagel 🚇 👀	ashu8912 💻	ffd8 💻
Sona Lee 💻	Ryan Slade 💻	Mann Shah	Juraj Onuska	ANURAG GUPTA 📖

Thanks goes to these wonderful people (emoji key)!