# p5.js

**URL:** https://discourse.processing.org/c/p5js/10.md

[Latest](https://discourse.processing.org/latest.md) · [Categories](https://discourse.processing.org/categories.md) · [Tags](https://discourse.processing.org/tags.md)

---

## [About the p5.js category](https://discourse.processing.org/t/about-the-p5-js-category/20)

<div class="topic-metadata">

**Author:** [@ProcessingOrg](https://discourse.processing.org/u/ProcessingOrg)\
**Replies:** 2\
**Last updated:** [November 6, 2023, 12:43pm UTC](https://discourse.processing.org/t/about-the-p5-js-category/20 "2023-11-06T12:43:27Z")

</div>

Discussions about p5.js programs and development

---

## [P5js 3D sketches - how to overlay a 2D image e.g. HUD or GUI](https://discourse.processing.org/t/p5js-3d-sketches-how-to-overlay-a-2d-image-e-g-hud-or-gui/49509)

<div class="topic-metadata">

**Author:** [@quark](https://discourse.processing.org/u/quark)\
**Replies:** 6\
**Last updated:** [September 28, 2026, 3:23pm UTC](https://discourse.processing.org/t/p5js-3d-sketches-how-to-overlay-a-2d-image-e-g-hud-or-gui/49509 "2026-09-28T15:23:43Z")

</div>

This sketch shows a p5.js animated sketch using WebGL (based on a library example) and there are three 2D images overlaying the animation. the inner frame the avatar the text The images are drawn by shaders created us…

---

## [Read error with TXT and CSV files. SyntaxError: expected expression, got keyword 'do' at undefined:965:8](https://discourse.processing.org/t/read-error-with-txt-and-csv-files-syntaxerror-expected-expression-got-keyword-do-at-undefined8/49463)

<div class="topic-metadata">

**Author:** [@mgdunefa2](https://discourse.processing.org/u/mgdunefa2)\
**Replies:** 2\
**Last updated:** [September 26, 2026, 2:59pm UTC](https://discourse.processing.org/t/read-error-with-txt-and-csv-files-syntaxerror-expected-expression-got-keyword-do-at-undefined8/49463 "2026-09-26T14:59:39Z")

</div>

‘’’ javascript let palabras = ; let palabraActual = “”; async function setup() { createCanvas(800, 500); try { const respuesta = await fetch(“palabras.txt”); const texto = await respuesta.text(); palabras = texto …

---

## [How do I get an obj file with one and only one texture?](https://discourse.processing.org/t/how-do-i-get-an-obj-file-with-one-and-only-one-texture/49437)

<div class="topic-metadata">

**Author:** [@EricRogerGarcia](https://discourse.processing.org/u/EricRogerGarcia)\
**Replies:** 1\
**Last updated:** [September 24, 2026, 6:40pm UTC](https://discourse.processing.org/t/how-do-i-get-an-obj-file-with-one-and-only-one-texture/49437 "2026-09-24T18:40:19Z")

</div>

Loading an obj file (with loadModel()) and then specifying the texture (with texture()) is not possible if there is no texture (in case the colors are specified in the mtl file) or if there are several images for texture…

---

## [P5js - inconsistent shader behaviour leading to program crashes](https://discourse.processing.org/t/p5js-inconsistent-shader-behaviour-leading-to-program-crashes/49386)

<div class="topic-metadata">

**Author:** [@quark](https://discourse.processing.org/u/quark)\
**Replies:** 6\
**Last updated:** [September 20, 2026, 10:33am UTC](https://discourse.processing.org/t/p5js-inconsistent-shader-behaviour-leading-to-program-crashes/49386 "2026-09-20T10:33:04Z")

</div>

Version 3 of canvasGUI (released April 2026) uses a shader to display the GUI over a webgl2 context within a p5.js sketch. This was successful and an example was created to demonstrate it. This example can be found here …

---

## [How would you change this sketch?](https://discourse.processing.org/t/how-would-you-change-this-sketch/47805)

<div class="topic-metadata">

**Author:** [@NickyDeep](https://discourse.processing.org/u/NickyDeep)\
**Replies:** 3\
**Last updated:** [September 19, 2026, 7:18pm UTC](https://discourse.processing.org/t/how-would-you-change-this-sketch/47805 "2026-09-19T19:18:44Z")

</div>

https://openprocessing.org/sketch/2857202 how would you change this sketch so that it got more interesting or funny or contrasted what would you do to it?

---

## [I made an Android p5.js editor — Edit:RiN](https://discourse.processing.org/t/i-made-an-android-p5-js-editor-edit-rin/49366)

<div class="topic-metadata">

**Author:** [@rin-code](https://discourse.processing.org/u/rin-code)\
**Replies:** 0\
**Last updated:** [September 14, 2026, 10:53am UTC](https://discourse.processing.org/t/i-made-an-android-p5-js-editor-edit-rin/49366 "2026-09-14T10:53:40Z")

</div>

Hi everyone! I’m currently developing Edit:RiN, a free and open-source p5.js editor for Android. I wanted a simple way to write p5.js sketches directly on my phone, preview them immediately, and keep creating wherever …

---

## [Problems with a shader overlaying a webgl2 canvas with a 2D image](https://discourse.processing.org/t/problems-with-a-shader-overlaying-a-webgl2-canvas-with-a-2d-image/49342)

<div class="topic-metadata">

**Author:** [@quark](https://discourse.processing.org/u/quark)\
**Replies:** 0\
**Last updated:** [September 11, 2026, 2:15pm UTC](https://discourse.processing.org/t/problems-with-a-shader-overlaying-a-webgl2-canvas-with-a-2d-image/49342 "2026-09-11T14:15:25Z")

</div>

EDIT: although the information in this discussion is accurate relevant it was based on the assumption there was a problem with the shader program used by canvasGUI. Since then I have carried out test that indicate the p…

---

## [Accessing width and height variables much slower in P5 Ver 2.0 compared to Ver 1.0](https://discourse.processing.org/t/accessing-width-and-height-variables-much-slower-in-p5-ver-2-0-compared-to-ver-1-0/49325)

<div class="topic-metadata">

**Author:** [@ozjerry](https://discourse.processing.org/u/ozjerry)\
**Replies:** 21\
**Last updated:** [September 11, 2026, 12:14pm UTC](https://discourse.processing.org/t/accessing-width-and-height-variables-much-slower-in-p5-ver-2-0-compared-to-ver-1-0/49325 "2026-09-11T12:14:03Z")

</div>

Problem: There seems to be a big discrepancy in performance I recently came back to P5 after not having used it for a few years. I’m just coding. I grabbed the latest version (2.3.2) and wrote a quick game of life prog…

---

## [Size limit of 250 MB issue](https://discourse.processing.org/t/size-limit-of-250-mb-issue/38173)

<div class="topic-metadata">

**Author:** [@gjs](https://discourse.processing.org/u/gjs)\
**Replies:** 7\
**Last updated:** [September 8, 2026, 11:22am UTC](https://discourse.processing.org/t/size-limit-of-250-mb-issue/38173 "2026-09-08T11:22:42Z")

</div>

I tried to upload a font to my asset folder but received the response: “Error: You cannot upload any more files. You have reached the total size limit of 250 MB. If you would like to upload more, please remove the ones …

---

## [I need help plz thanks if you do im a beginner sorry](https://discourse.processing.org/t/i-need-help-plz-thanks-if-you-do-im-a-beginner-sorry/49230)

<div class="topic-metadata">

**Author:** [@chuudtaco](https://discourse.processing.org/u/chuudtaco)\
**Replies:** 2\
**Last updated:** [August 21, 2026, 5:41am UTC](https://discourse.processing.org/t/i-need-help-plz-thanks-if-you-do-im-a-beginner-sorry/49230 "2026-08-21T05:41:25Z")

</div>

hi I don’t know why my keyPressed isn’t working, I copied and pasted references and they don’t work either, i’m not sure if it’s a me problem. https://editor.p5js.org/chuud/sketches/FtKfFDUL5 sorry if i used wrong form…

---

## [Enable touch actions on mobile over the p5js canvas itself](https://discourse.processing.org/t/enable-touch-actions-on-mobile-over-the-p5js-canvas-itself/49199)

<div class="topic-metadata">

**Author:** [@dandan](https://discourse.processing.org/u/dandan)\
**Replies:** 2\
**Last updated:** [August 18, 2026, 7:13pm UTC](https://discourse.processing.org/t/enable-touch-actions-on-mobile-over-the-p5js-canvas-itself/49199 "2026-08-18T19:13:06Z")

</div>

Hello! I have an issue both on ios and android where all touch actions like scrolling, zooming, moving around while zoomed in, seem to be disabled when doing them over the canvas. They work fine on the outside edges. I’…

---

## [P5JS Web Editor - Organisation of Sketches](https://discourse.processing.org/t/p5js-web-editor-organisation-of-sketches/49195)

<div class="topic-metadata">

**Author:** [@Doyle](https://discourse.processing.org/u/Doyle)\
**Replies:** 1\
**Last updated:** [August 18, 2026, 2:02pm UTC](https://discourse.processing.org/t/p5js-web-editor-organisation-of-sketches/49195 "2026-08-18T14:02:51Z")

</div>

I have created more than a hundred of sketches on the P5js web editor. Wanted to ask if there is some kind of folder structure which i can used within the web editor to organise the sketches. Otherwise I will need to r…

---

## [Improve loop protection warning for slow loops that are not infinite](https://discourse.processing.org/t/improve-loop-protection-warning-for-slow-loops-that-are-not-infinite/49147)

<div class="topic-metadata">

**Author:** [@michtesar](https://discourse.processing.org/u/michtesar)\
**Replies:** 1\
**Last updated:** [August 15, 2026, 7:59pm UTC](https://discourse.processing.org/t/improve-loop-protection-warning-for-slow-loops-that-are-not-infinite/49147 "2026-08-15T19:59:24Z")

</div>

Description The p5.js Web Editor’s loop protection can report an infinite loop when a loop is simply expensive to execute. For example, this p5.js issue was initially reported as an infinite loop: After profiling it,…

---

## [Making keyPressed() doesn't seem to work in p5.js as it did in Java, how can I make it work or replace it?](https://discourse.processing.org/t/making-keypressed-doesnt-seem-to-work-in-p5-js-as-it-did-in-java-how-can-i-make-it-work-or-replace-it/49153)

<div class="topic-metadata">

**Author:** [@superPengato](https://discourse.processing.org/u/superPengato)\
**Replies:** 4\
**Last updated:** [August 13, 2026, 6:13pm UTC](https://discourse.processing.org/t/making-keypressed-doesnt-seem-to-work-in-p5-js-as-it-did-in-java-how-can-i-make-it-work-or-replace-it/49153 "2026-08-13T18:13:58Z")

</div>

Hello ! I have a game that I created years ago as a school project in processing Java, and now I’ve been trying to port it to js so that I can put it on a webpage. I am not experienced in JS. I did a lot of it with ava…

---

## [Survey on p5.js dependencies](https://discourse.processing.org/t/survey-on-p5-js-dependencies/49141)

<div class="topic-metadata">

**Author:** [@maveme](https://discourse.processing.org/u/maveme)\
**Replies:** 0\
**Last updated:** [August 11, 2026, 8:29am UTC](https://discourse.processing.org/t/survey-on-p5-js-dependencies/49141 "2026-08-11T08:29:33Z")

</div>

Hi all, We are researchers in computer science from VU Amsterdam and Université de Montréal working on code analysis techniques to document and preserve p5.js generative art. As part of this work, we are documenting the…

---

## [V2 offline reference?](https://discourse.processing.org/t/v2-offline-reference/49127)

<div class="topic-metadata">

**Author:** [@EricRogerGarcia](https://discourse.processing.org/u/EricRogerGarcia)\
**Replies:** 1\
**Last updated:** [August 7, 2026, 8:29pm UTC](https://discourse.processing.org/t/v2-offline-reference/49127 "2026-08-07T20:29:17Z")

</div>

is there a way to download it ? :slight\_smile:

---

## [Example of Preload with await using a Files class](https://discourse.processing.org/t/example-of-preload-with-await-using-a-files-class/49108)

<div class="topic-metadata">

**Author:** [@EricRogerGarcia](https://discourse.processing.org/u/EricRogerGarcia)\
**Replies:** 2\
**Last updated:** [August 6, 2026, 10:23pm UTC](https://discourse.processing.org/t/example-of-preload-with-await-using-a-files-class/49108 "2026-08-06T22:23:08Z")

</div>

We can easily add the other functions starting with “load”. Sketch here Code : function setup() { createCanvas(500, 400); textSize(30); textAlign(CENTER); imageMode(CENTER); Files.loadImage("chat01.jpg");…

---

## [How to get the values of the current matrix (after translate, scale, rotateY...)?](https://discourse.processing.org/t/how-to-get-the-values-of-the-current-matrix-after-translate-scale-rotatey/48995)

<div class="topic-metadata">

**Author:** [@EricRogerGarcia](https://discourse.processing.org/u/EricRogerGarcia)\
**Replies:** 15\
**Last updated:** [July 28, 2026, 9:18am UTC](https://discourse.processing.org/t/how-to-get-the-values-of-the-current-matrix-after-translate-scale-rotatey/48995 "2026-07-28T09:18:07Z")

</div>

To see if I could get from it the Global position, the global scale, the global rotations x y z after using translate(), rotate x,y, z, scale()… multiple times :slight\_smile:

---

## [Help Test the SVG Import & Export Addon for p5.js (GSoC 2026)](https://discourse.processing.org/t/help-test-the-svg-import-export-addon-for-p5-js-gsoc-2026/49019)

<div class="topic-metadata">

**Author:** [@VANSH3104](https://discourse.processing.org/u/VANSH3104)\
**Replies:** 3\
**Last updated:** [July 24, 2026, 1:41pm UTC](https://discourse.processing.org/t/help-test-the-svg-import-export-addon-for-p5-js-gsoc-2026/49019 "2026-07-24T13:41:30Z")

</div>

Hi everyone, As part of Google Summer of Code 2026 with p5.js, I’ve been working on an addon that adds SVG import and export support using the Shape system. Since my last update, the SVG import addon is now ready for t…

---

## [My beginner Number-growing code stopped working?](https://discourse.processing.org/t/my-beginner-number-growing-code-stopped-working/49033)

<div class="topic-metadata">

**Author:** [@sohelpme](https://discourse.processing.org/u/sohelpme)\
**Replies:** 3\
**Last updated:** [July 23, 2026, 3:22am UTC](https://discourse.processing.org/t/my-beginner-number-growing-code-stopped-working/49033 "2026-07-23T03:22:44Z")

</div>

hello guys, i had an artistic sketch i made that suddenly, (or around half a year ago) stopped working, and a bunch of errors that never happened are there. and here is one where it works fine p5.js Web Editor | Number…

---

## [Some fun with sinusoidals, like a catalog](https://discourse.processing.org/t/some-fun-with-sinusoidals-like-a-catalog/49002)

<div class="topic-metadata">

**Author:** [@vkbr](https://discourse.processing.org/u/vkbr)\
**Replies:** 0\
**Last updated:** [July 18, 2026, 6:48am UTC](https://discourse.processing.org/t/some-fun-with-sinusoidals-like-a-catalog/49002 "2026-07-18T06:48:29Z")

</div>

click through more than 30 different expressions. let pg; let points = ; let x = 0; let res = 1; let expression = ""; let expr = 0; let valInput = 0; // Geometric layouts calculated based on window size let v\_s…

---

## [Solved: WebGL P5 sketch: Diagonal Bottom Blades Seem Skewed](https://discourse.processing.org/t/solved-webgl-p5-sketch-diagonal-bottom-blades-seem-skewed/48983)

<div class="topic-metadata">

**Author:** [@Boleeman](https://discourse.processing.org/u/Boleeman)\
**Replies:** 2\
**Last updated:** [July 12, 2026, 1:50am UTC](https://discourse.processing.org/t/solved-webgl-p5-sketch-diagonal-bottom-blades-seem-skewed/48983 "2026-07-12T01:50:07Z")

</div>

Hi All. I am currently trying to make a P5 WebGL version of a Diagonal Blades P5 program I made previously. The standard version renders properly (with the biggest blades aligned to the left side) but in the WebGL versi…

---

## ["You cannot upload any more files" in p5.js web editor](https://discourse.processing.org/t/you-cannot-upload-any-more-files-in-p5-js-web-editor/48976)

<div class="topic-metadata">

**Author:** [@willdknyc](https://discourse.processing.org/u/willdknyc)\
**Replies:** 1\
**Last updated:** [July 9, 2026, 10:37am UTC](https://discourse.processing.org/t/you-cannot-upload-any-more-files-in-p5-js-web-editor/48976 "2026-07-09T10:37:01Z")

</div>

Also, do you know how to address this? Error: You cannot upload any more files. You have reached the total size limit of 250 MB. If you would like to upload more, please remove the ones you aren’t using anymore by in yo…

---

## [Error: Multiple infinite loops detected. Stopping execution. at undefined:2:33088 \_ how do I resolve this?](https://discourse.processing.org/t/error-multiple-infinite-loops-detected-stopping-execution-at-undefined33088-how-do-i-resolve-this/48974)

<div class="topic-metadata">

**Author:** [@willdknyc](https://discourse.processing.org/u/willdknyc)\
**Replies:** 3\
**Last updated:** [July 8, 2026, 5:37pm UTC](https://discourse.processing.org/t/error-multiple-infinite-loops-detected-stopping-execution-at-undefined33088-how-do-i-resolve-this/48974 "2026-07-08T17:37:14Z")

</div>

\<!let img; let cnv; function preload() { img = loadImage(‘assets/IMG\_0299\_2.jpg’); } //only run once function setup() { cnv = createCanvas(img.width, img.height); let newCanvasX = (windowWidth - img.width)/2; le…

---

## [canvasGUI 3.1.0 (new release)](https://discourse.processing.org/t/canvasgui-3-1-0-new-release/48969)

<div class="topic-metadata">

**Author:** [@quark](https://discourse.processing.org/u/quark)\
**Replies:** 0\
**Last updated:** [July 7, 2026, 9:39am UTC](https://discourse.processing.org/t/canvasgui-3-1-0-new-release/48969 "2026-07-07T09:39:28Z")

</div>

Version 3.1.0 of canvasGUI is now available. Users will find that the new library is backwardly compatible so will work with any sketches using V3.0.0. The biggest change is in the viewer control which allows the user t…

---

## [Inside canvasGUI 3](https://discourse.processing.org/t/inside-canvasgui-3/48968)

<div class="topic-metadata">

**Author:** [@quark](https://discourse.processing.org/u/quark)\
**Replies:** 0\
**Last updated:** [July 7, 2026, 8:19am UTC](https://discourse.processing.org/t/inside-canvasgui-3/48968 "2026-07-07T08:19:30Z")

</div>

To encourage programmers to experiment with canvasGUI and extend or customize its functionality I have previously posted discussions on how to create user defined controls. canvasGUI 3 : user-defined controls (1) canva…

---

## [Adding id to Input and Select](https://discourse.processing.org/t/adding-id-to-input-and-select/48549)

<div class="topic-metadata">

**Author:** [@4everJang](https://discourse.processing.org/u/4everJang)\
**Replies:** 3\
**Last updated:** [June 30, 2026, 10:07am UTC](https://discourse.processing.org/t/adding-id-to-input-and-select/48549 "2026-06-30T10:07:08Z")

</div>

Trying to programmatically change inputs (and selected options) but there is no @id on any of the input and select fields created with createInput and createSelect. Is this possible at all or do I have to create my own i…

---

## [Help Test SVG Export for p5.js (GSoC 2026)](https://discourse.processing.org/t/help-test-svg-export-for-p5-js-gsoc-2026/48850)

<div class="topic-metadata">

**Author:** [@VANSH3104](https://discourse.processing.org/u/VANSH3104)\
**Replies:** 6\
**Last updated:** [June 26, 2026, 1:29pm UTC](https://discourse.processing.org/t/help-test-svg-export-for-p5-js-gsoc-2026/48850 "2026-06-26T13:29:56Z")

</div>

Looking for Feedback on SVG Export for p5.js Hi everyone, As part of Google Summer of Code 2026 with p5.js, I’ve been working on an addon that adds SVG export and import support using the Shape system. Version 1 of the…

---

## [Chicago: July 2nd 6-8pm p5 workshop "Deconstructing the Image" workshop with Maddie Brucker](https://discourse.processing.org/t/chicago-july-2nd-6-8pm-p5-workshop-deconstructing-the-image-workshop-with-maddie-brucker/48849)

<div class="topic-metadata">

**Author:** [@hypergrace](https://discourse.processing.org/u/hypergrace)\
**Replies:** 0\
**Last updated:** [June 23, 2026, 4:28am UTC](https://discourse.processing.org/t/chicago-july-2nd-6-8pm-p5-workshop-deconstructing-the-image-workshop-with-maddie-brucker/48849 "2026-06-23T04:28:50Z")

</div>

Greetings Chicago p5.js community! On July 2nd from 6-8 at Mouse Arts and Letters Club in Bridgeport, CCAM: Center for Concrete and Abstract Machines and ALMANAC artist collective are hosting Maddie Brucker for a p5.js …

[Next page](https://discourse.processing.org/c/p5js/10.md?page=1)