Repository files navigation

Welcome! 👋👋🏿👋🏽👋🏻👋🏾👋🏼

p5.js is a free and open-source JavaScript library foraccessible creative coding. It is a nurturing community, an approachable language, an exploratory tool, an accessible environment, an inclusive platform, welcoming and playful for artists, designers, educators, beginners, and anyone else!

functionsetup(){ createCanvas(400,400);  background(255);}functiondraw(){ circle(mouseX,mouseY,80);}

Get Started —Reference —Tutorials —Examples —Libraries —Forum —Discord

p5.js is built and organized to prioritizeaccessibility, inclusivity, community, and joy. Similar to sketching, p5.js has a full set of tools to draw. It also supports creating audio-visual, interactive, experimental, and generative works for the web. p5.js enables thinking of a web page as your sketch. p5.js is accessible in multiple languages and has an expansivedocumentation with visual examples. You can findtutorials on the p5.js website and start coding right now in thep5.js web editor. You can extend p5.js with many community-createdlibraries that bring different capabilities. Its community provides endless inspiration and support for creators.

p5.js encourages iterative and exploratory code for creative expression. Its friendly, diverse community shares art, code, and learning resources to help elevate all voices. We share our values in open source and access for all, to learn, create, imagine, design, share and code freely.

The p5.js community shares an interest in exploring the creation of art and design with technology. We are a community of, and in solidarity with, people from every gender identity and expression, sexual orientation, race, ethnicity, language, neuro-type, size, disability, class, caste, religion, culture, subculture, immigration status, age, skill level, occupation, and background. We stand in solidarity with justice and liberation movements. We work to acknowledge, dismantle, and prevent barriers to access p5.js code and the p5.js community.

Learn more aboutour community and read our community statement andcode of conduct. You can directly support our work with p5.js by donating tothe Processing Foundation.

We are releasing p5.js 2.0 to the community for testing and development! Here’s what you need to know.

• Forreference: p5.js 1.x reference will stay onhttps://p5js.org/, and p5.js 2.x documentation will be onhttps://beta.p5js.org/
• In the p5.js Editor: thedefault will continue to be 1.x until at least August 2026 - more information and discussion on timeline can be found onthis Discourse thread orthis GitHub thread
• For updating sketches and add-on libraries: check outthe compatibility add-on libraries and guides
• Forcontribution:npm latest will default to 2.x, but the git branches are still separated withmain on 1.x anddev-2.0 on 2.x. We will switch the branches when we have updated all automations (including deploying updated documentation to the website). Want to contribute ideas or implementation? Check the2.x project board for an overview of what still needs discussion, and what’s ready for work!

If you have found a bug in the p5.js library or want to request new features, feel free to file an issue! See ourcontributor guidelines for a full reference of our contribution process. A set of templates for reporting issues and requesting features are provided to assist you (and us!). Different parts of p5.js are in different repositories. You can open an issue on each of them through these links:

p5.js —p5.js website —-p5.js web editor

p5.js is maintained mostly by volunteers, so we thank you for your patience as we try to address your issues as soon as we can.

p5.js is a collaborative project with many contributors, mostly volunteers, and you are invited to help. All types of involvement are welcome. See thecontribute for more in-depth details about contributing to different areas of the project, including code, bug fixes, documentation, discussion, and more.

A quick Getting Started with the Build and setting up the repository could be foundhere.

This project doesnot accept fully AI-generated contributions. AI tools may be used assistively only. As a contributor, you should be able to understand and take responsibility for changes you make to the codebase.

More details can be found in ourAI Usage Policy andAGENTS.md.

Stewards are contributors who are particularly involved, familiar, or responsive to certain areas of the project. Their role is to help provide context and guidance to others working on p5.js. If you have a question about contributing to a particular area, you can tag the listed steward in an issue or pull request. They may also weigh in on feature requests and guide the overall direction of their area, with the input of the community. You can read more about the organization of the project in our p5.jsContributor Guidelines and p5.jsSteward Guidelines.

Anyone interested can volunteer to be a steward! There are no specific requirements for expertise, just an interest in actively learning and participating. If you’re familiar with or interested in actively learning and participating in some of the p5.js areas below, please reply tothis issue mentioning which area(s) you are interested in volunteering as a steward! 👋👋👋

p5.js was created byLauren Lee McCarthy in 2013 as a new interpretation of Processing for the context of the web. Since then we have allowed ourselves space to deviate and grow, while drawing inspiration from Processing and our shared community. p5.js is sustained by a community of contributors, with support from the Processing Foundation. p5.js follows a rotating leadership model started in 2020, andQianqian Ye has been leading p5.js since 2021. Learn more about thepeople behind p5.js.

Current Lead/Mentor

• @ksen0 - p5.js Lead，2024-present
• @limzykenneth - p5.js Mentor，2023-present

Lead/Mentor Alumni

• @lmccart - p5.js Creator
• @qianqianye - p5.js Lead，2021-present (on leave)
• @outofambit - p5.js Co-Lead 2021-22, Mentor 2022-2023
• @mcturner1995 - p5.js Lead 2020

We recognize all types of contributions. This project follows theall-contributors specification and theEmoji Key ✨ for contribution types. Instructions to add yourself or add contribution emojis to your name arehere. You can also post an issue or comment on a pull request with the text:@all-contributors please add @YOUR-USERNAME for THINGS (whereTHINGS is a comma-separated list of entries from thelist of possible contribution types) and our nice bot will add you toCONTRIBUTORS.md automatically!

Thanks to all the wonderful contributors! 💓