Learn
These tutorials provide more in-depth or step-by-step overviews of particular topics. Check out the examples page to explore short demonstrations of various p5.js topics.
Introduction to p5.js
Welcome to p5.js!
This introduction covers the basics of setting up a p5.js project.
An overview of the main features of p5.js.
The main differences between the two, and how to convert from one to the other.
How to set up a local server on Mac OSX, Windows, or Linux.
Additonal documentation and tutorials contributed by the community
Setting up p5 so that it can be used easily with a screen reader.
Connecting p5.js
Using a node.js server with p5.js, communication via socket.io.
Programming topics
Creating and manipulating elements on the page beyond the canvas.
Developing advanced graphics applications in p5.js using WEBGL mode.
An introduction to digital color.
Drawing simple shapes and using the coordinate system.
An introduction to the three types of curves in p5.js: arcs, spline curves, and Bézier curves.
Introduction to interactivity with the mouse and keyboard.
Introduction to controlling program flow in p5.js.
Becoming a better programmer
Field guide to debugging for everyone.
A tutorial of tips and tricks for optimizing your code to make it run faster and smoother.
Save yourself from agony on install day. What is unit testing and how to use it? By Andy Timmons.
Contributing to the community
Getting started and overview for contributing to development.
A friendly intro to the file structure and tools for p5.js development, by Luisa Pereira.
A guide to writing a p5.js programming tutorial.
Creating p5.js addon libraries.