Find easy explanations for every piece of p5.js code.
Looking for p5.sound? Go to the p5.sound reference!
Finds the closest schema to the input arguments.
Runs parameter validation by matching the input parameters to Zod schemas generated from the parameter data from docs/parameterData.json.
Draws an arc.
Draws a circle.
Draws an ellipse (oval).
Draws a straight line between two points.
Draws a single point in space.
Draws a quadrilateral (four-sided shape).
Draws a rectangle.
Draws a square.
Draws a triangle.
Load a 3d model from an OBJ or STL string.
This function checks if the file is in ASCII format or in Binary format
Loads a 3D model to create a p5.Geometry object.
This function matches the query at the provided offset
Draws a p5.Geometry object to the canvas.
ASCII STL file starts with solid 'nameOfFile' Then contain the normal of the face, starting with facet normal Next contain a keyword indicating the start of face vertex, outer loop Next comes the three vertex, starting with vertex x y z Vertices ends with endloop Face ends with endfacet Next face starts with facet normal The end of the file is indicated by endsolid
This function parses the Binary STL files
Parse OBJ lines into model
STL files can be of two types, ASCII and Binary,
Draws a box (rectangular prism).
Creates a custom p5.Geometry object from simpler 3D shapes.
Draws a cone.
Sets the number of segments used to draw spline curves in WebGL mode.
Draws a cylinder.
Draws an ellipsoid.
Clears a p5.Geometry object from the graphics processing unit (GPU) memory.
Draws a plane.
The saveObj() function exports p5.Geometry objects as 3D models in the Wavefront .obj file format
The saveStl() function exports p5.Geometry objects as 3D models in the STL stereolithography file format
Draws a sphere.
Sets the stroke rendering mode to balance performance and visual features when drawing lines.
Draws a torus.
Changes where ellipses, circles, and arcs are drawn.
Draws certain features with jagged (aliased) edges.
Changes where rectangles and squares are drawn.
Draws certain features with smooth (antialiased) edges.
Sets the style for rendering the ends of lines.
Sets the style of the joints that connect line segments.
Sets the width of the stroke used for points, lines, and the outlines of shapes.
Draws a Bézier curve.
Calculates coordinates along a Bézier curve using interpolation.
Calculates coordinates along a line that's tangent to a Bézier curve.
Calculates coordinates along a spline curve using interpolation.
Calculates coordinates along a line that's tangent to a spline curve.
Draws a curve using a Catmull-Rom spline.
Begins creating a hole within a flat shape.
Stops creating a hole within a flat shape.
Adds a vertex to a custom shape.
Begins adding vertices to a custom shape.
Adds a Bézier curve segment to a custom shape.
Adds a spline curve segment to a custom shape.
Sets the normal vector for vertices in a custom 3D shape.
Sets the shader's vertex property or attribute variables.
Calculates the position and size of the smallest box that contains the geometry.
Removes the geometry’s internal colors.
Computes the geometry's faces using its vertices.
Calculates the normal vector for each vertex on the geometry.
An array that lists which of the geometry's vertices form each of its faces.
Flips the geometry’s texture u-coordinates.
Flips the geometry’s texture v-coordinates.
Transforms the geometry's vertices to fit snugly within a 100×100×100 box centered at the origin.
An array that lists the texture coordinates for each of the geometry's vertices.
An array with the vectors that are normal to the geometry's vertices.
An array with the geometry's vertices.
HSB (hue, saturation, brightness) is a type of color model
Gets the alpha (transparency) value of a color.
Gets the blue value of a color.
Gets the brightness value of a color.
Creates a p5.Color object.
Gets the green value of a color.
Gets the hue value of a color.
Blends two colors to find a third color between them.
Gets the lightness value of a color.
Blends multiple colors to find a color between them.
Gets the red value of a color.
Gets the saturation value of a color.
Sets the color used for the background of the canvas.
Starts defining a shape that will mask any shapes drawn afterward.
Sets the way colors blend when added to the canvas.
Defines a shape that will mask any shapes drawn afterward.
Changes the way color values are interpreted.
Ends defining a mask that was started with beginClip().
Starts using shapes to erase parts of the canvas.
Sets the color used to fill shapes.
Ends erasing that was started with erase().
Disables setting the fill color for shapes.
Disables drawing points, lines, and the outlines of shapes.
Sets the color used to draw points, lines, and the outlines of shapes.
Sets the alpha (transparency) value of a color.
Sets the blue component of a color.
Sets the green component of a color.
Sets the red component of a color.
Returns the color formatted as a String.
Returns the loose ascent of the text based on the font's intrinsic metrics.
Computes a generic (non-tight) bounding box for a block of text.
Returns the loose descent of the text based on the font's intrinsic metrics.
Returns the loose width of a text string based on the current font.
Loads a font and creates a p5.Font object
Draws text to the canvas.
Sets the way text is aligned when text() is called.
Returns the ascent of the text.
Computes the tight bounding box for a block of text.
Returns the descent of the text.
Sets or gets the text drawing direction.
Sets the font used by the text() function.
Sets the spacing between lines of text when text() is called.
Gets or sets text properties in batch, similar to calling textProperty() multiple times.
Sets or gets a single text property for the renderer.
Sets or gets the current text size.
Sets the style for system fonts when text() is called.
Sets or gets the current font weight.
Calculates the width of the given text string in pixels.
Sets the style for wrapping text when text() is called.
Returns an array of arrays of points outlining a string of text written using the font
Test
Returns an array of points outlining a string of text written using the font.
Creates a new p5.Image object.
Saves the current canvas as an image.
Captures a sequence of frames from the canvas that can be saved as images.
Draws an image to the canvas.
Changes the location from which images are drawn when image() is called.
Loads an image to create a p5.Image object.
Removes the current tint set by tint().
Generates a gif from a sketch and saves it to a file.
Tints images using a color.
Copies a region of pixels from one image to another.
Copies pixels from a source image to a region of the canvas.
Applies an image filter to the canvas.
Gets a pixel or a region of pixels from the canvas.
An array containing the color of each pixel on the canvas.
Sets the color of a pixel or draws an image to the canvas.
Copies a region of pixels from another image into this one.
Copies pixels from a source image to this image.
Changes the delay between frames in an animated GIF.
Applies an image filter to the image.
Gets a pixel or a region of pixels from the image.
Gets the index of the current frame in an animated GIF.
The image's height in pixels.
Loads the current value of each pixel in the image into the img.pixels array.
Masks part of the image with another.
Returns the number of frames in an animated GIF.
Pauses an animated GIF.
Gets or sets the pixel density for high pixel density displays.
An array containing the color of each pixel in the image.
Plays an animated GIF that was paused with img.pause().
Restarts an animated GIF at its first frame.
Resizes the image to a given width and height.
Saves the image to a file.
Sets the color of one or more pixels within an image.
Sets the current frame in an animated GIF.
Updates the canvas with the RGBA values in the img.pixels array.
The image's width in pixels.
Applies a transformation matrix to the coordinate system.
Ends a drawing group that contains its own styles and transformations.
Begins a drawing group that contains its own styles and transformations.
Clears all transformations applied to the coordinate system.
Rotates the coordinate system.
Rotates the coordinate system about the x-axis in WebGL mode.
Rotates the coordinate system about the y-axis in WebGL mode.
Rotates the coordinate system about the z-axis in WebGL mode.
Scales the coordinate system.
Shears the x-axis so that shapes appear skewed.
Shears the y-axis so that shapes appear skewed.
Translates the coordinate system.
Changes the cursor's appearance.
A Number variable that tracks the number of milliseconds it took to draw the last frame.
Creates a screen reader-accessible description of the canvas.
Creates a screen reader-accessible description of elements in the canvas.
Returns the display's current pixel density.
A Number variable that stores the height of the screen display.
A Number variable that stores the width of the screen display.
A Boolean variable that's true if the browser is focused and false if not.
A Number variable that tracks the number of frames drawn since the sketch started.
Sets the number of frames to draw per second.
Toggles full-screen mode or returns the current mode.
Returns the target frame rate.
Returns the sketch's current URL as a String.
Returns the current URL parameters in an Object.
Returns the current URL path as an Array of Strings.
Creates a screen reader-accessible description of shapes on the canvas.
A Number variable that stores the height of the canvas in pixels.
Hides the cursor from view.
Sets the pixel density or returns the current density.
Converts 2D screen coordinates to 3D world coordinates.
A String variable with the WebGL version in use.
A Number variable that stores the width of the canvas in pixels.
A Number variable that stores the height of the browser's viewport.
A function that's called when the browser window is resized.
A Number variable that stores the width of the browser's viewport.
Converts 3D world coordinates to 2D screen coordinates.
Sets the position and orientation of the current camera in a 3D sketch.
Creates a new p5.Camera object and sets it as the current (active) camera.
Sets the frustum of the current camera in a 3D sketch.
Enables or disables perspective for lines in 3D sketches.
Sets an orthographic projection for the current camera in a 3D sketch.
Sets a perspective projection for the current camera in a 3D sketch.
Sets the current (active) camera of a 3D sketch.
Adds a grid and an axes icon to clarify orientation in 3D sketches.
Turns off debugMode() in a 3D sketch.
Allows the user to orbit around a 3D sketch using a mouse, trackpad, or touchscreen.
Creates a light that shines from all directions.
Creates a light that shines in one direction.
Creates an ambient light from an image.
Sets the falloff rate for pointLight() and spotLight().
Places an ambient and directional light in the scene
Removes all lights from the sketch.
Creates an immersive 3D background.
Creates a light that shines from a point in all directions.
Sets the specular color for lights.
Creates a light that shines from a point in one direction.
Sets the ambient color of shapes’ surface material.
Get the shader used when no lights or materials are applied.
Get the base shader for filters.
Get the default shader used with lights, materials, and textures.
Get the shader used by normalMaterial().
Get the shader used when drawing the strokes of shapes.
Binds the texture to the appropriate GL target.
Creates a p5.Shader object to be used with the filter() function.
Creates a new p5.Shader object.
Sets the emissive color of shapes’ surface material.
Sets the p5.Shader object to apply for images.
Creates and loads a filter shader from an external file.
Loads vertex and fragment shaders to create a p5.Shader object.
Sets the amount of "metalness" of a specularMaterial().
Sets the current material as a normal material.
Restores the default shaders.
Sets how a texture is be interpolated when upscaled or downscaled
Sets the texture wrapping mode
Sets the p5.Shader object to apply while drawing.
Sets the amount of gloss ("shininess") of a specularMaterial().
Sets the specular color of shapes’ surface material.
Sets the p5.Shader object to apply for strokes.
Sets the texture that will be used on shapes.
Changes the coordinate system used for textures when they’re applied to custom shapes.
Changes the way textures behave when a shape’s uv coordinates go beyond the texture.
Unbinds the texture from the appropriate GL target.
Checks if the source data for this texture has changed (if it's easy to do so) and reuploads the texture if necessary
Sets the position and orientation of the camera.
The x-coordinate of the place where the camera looks.
The y-coordinate of the place where the camera looks.
The camera’s x-coordinate.
The camera’s y-coordinate.
The camera’s z-coordinate.
Sets the camera's frustum.
Points the camera at a location.
Moves the camera along its "local" axes without changing its orientation.
Sets an orthographic projection for the camera.
Rotates the camera left and right.
Sets a perspective projection for the camera.
Sets the camera’s position, orientation, and projection by copying another camera.
Sets the camera’s position in "world" space without changing its orientation.
Sets the camera’s position and orientation to values that are in-between those of two other cameras.
Rotates the camera up and down.
The x-component of the camera's "up" vector.
The y-component of the camera's "up" vector.
The z-component of the camera's "up" vector.
Copies the shader from one drawing context to another.
Logs the hooks available in this shader, and their current implementation.
Returns a new shader, based on the original, but with custom snippets of shader code replacing default behaviour.
Sets the shader’s uniform (global) variables.
Shaders are written in GLSL, but there are different versions of GLSL that it might be written in.
Loads the current value of each pixel on the canvas into the pixels array.
Updates the canvas with the RGBA values in the pixels array.
Helper fxn to measure ascent and descent
Clears the depth buffer in WebGL mode.
Creates a canvas element on the web page.
Creates and a new p5.Framebuffer object.
Creates a p5.Graphics object.
A system variable that provides direct access to the sketch's <canvas> element.
Removes the default canvas.
Resizes the canvas to a given width and height.
Set attributes for the WebGL Drawing context
Toggles the framebuffer's autosizing mode or returns the current mode.
Begins drawing shapes to the framebuffer.
An object that stores the framebuffer's color data.
Creates a new p5.Camera object to use with the framebuffer.
An object that stores the framebuffer's depth data.
Draws to the framebuffer by calling a function that contains drawing instructions.
Stops drawing shapes to the framebuffer.
Gets a pixel or a region of pixels from the framebuffer.
Sets the framebuffer's pixel density or returns its current density.
An array containing the color of each pixel in the framebuffer.
Deletes the framebuffer from GPU memory.
Resizes the framebuffer to a given width and height.
Creates a new p5.Framebuffer object with the same WebGL context as the graphics buffer.
Removes the graphics buffer from the web page.
Resets the graphics buffer's transformations and lighting.
Resize our canvas element.
Calculates the absolute value of a number.
Calculates the closest integer value that is greater than or equal to a number.
Constrains a number between a minimum and maximum value.
Calculates the value of Euler's number e (2.71828...) raised to the power of a number.
Calculates the closest integer value that is less than or equal to the value of a number.
Calculates the fractional part of a number.
Calculates a number between two numbers at a specific increment.
Calculates the natural logarithm (the base-e logarithm) of a number.
Calculates the magnitude, or length, of a vector.
Re-maps a number from one range to another.
Returns the largest value in a sequence of numbers.
Returns the smallest value in a sequence of numbers.
Maps a number from one range to a value between 0 and 1.
Calculates exponential expressions such as 2^3.
Calculates the integer closest to a number.
Calculates the square of a number.
Calculates the square root of a number.
Returns random numbers that can be tuned to feel organic.
Adjusts the character of the noise produced by the noise() function.
Sets the seed value for the noise() function.
Returns a random number or a random element from an array.
Returns a random number fitting a Gaussian, or normal, distribution.
Sets the seed value for the random() and randomGaussian() functions.
Calculates the arc cosine of a number.
Changes the unit system used to measure angles.
Calculates the arc sine of a number.
Calculates the arc tangent of a number.
Calculates the angle formed by a point, the origin, and the positive x-axis.
Calculates the cosine of an angle.
Converts an angle measured in radians to its value in degrees.
Converts an angle measured in degrees to its value in radians.
Calculates the sine of an angle.
Calculates the tangent of an angle.
Creates a new p5.Matrix object.
Creates a new p5.Vector object.
Calculates the distance between two points.
Adds to a vector's x, y, and z components.
Calculates the angle between two vectors.
Returns the vector's components as an array of numbers.
Returns a copy of the p5.Vector object.
Calculates the cross product of two vectors.
Calculates the Euclidean distance between two points (considering a point as a vector object).
Divides a vector's x, y, and z components.
Calculates the dot product of two vectors.
Checks whether all the vector's components are equal to another vector's.
Creates a new 2D vector from an angle.
Creates a new 3D vector from a pair of ISO spherical angles.
Retrieves the value at the specified index from the vector.
Calculates the angle a 2D vector makes with the positive x-axis.
Calculates new x, y, and z components that are proportionally the same distance between two vectors.
Limits a vector's magnitude to a maximum value.
Calculates the magnitude (length) of the vector.
Calculates the magnitude (length) of the vector squared.
Multiplies a vector by a scalar and returns a new vector.
Scales the components of a p5.Vector object so that its magnitude is 1.
Creates a new 2D unit vector with a random heading.
Creates a new 3D unit vector with a random heading.
Reflects a vector about a line in 2D or a plane in 3D.
Performs modulo (remainder) division with a vector's x, y, and z components.
Rotates a 2D vector by an angle without changing its magnitude.
Sets the vector's x, y, and z components.
Rotates a 2D vector to a specific angle without changing its magnitude.
Sets a vector's magnitude to a given value.
Sets the value at the specified index of the vector.
Calculates a new heading and magnitude that are between two vectors.
Returns a string representation of a vector.
The x component of the vector
The y component of the vector
The z component of the vector
Clears the pixels on the canvas.
Saves the file and closes the print stream.
Creates a new p5.PrintWriter object.
Method for executing an HTTP request
Method for executing an HTTP GET request
Method for executing an HTTP POST request
This method is suitable for fetching files up to size of 64MB.
Loads a JSON file to create an Object.
Loads a text file to create an Array.
Reads the contents of a file or URL and creates a p5.Table object with its values
Loads an XML file to create a p5.XML object.
Displays text in the web browser's console.
Saves a given element(image, text, json, csv, wav, or html) to the client's computer
Saves an Object or Array to a JSON file.
Saves an Array of Strings to a file, one per line.
Writes the contents of a Table object to a file
Writes data to the print stream without adding new lines.
Returns the current day as a number from 1–31.
Returns the current hour as a number from 0–23.
Returns the number of milliseconds since a sketch started running.
Returns the current minute as a number from 0–59.
Returns the current month as a number from 1–12.
Returns the current second as a number from 0–59.
Returns the current year as a number such as 1999.
Use addColumn() to add a new column to a Table object
Use addRow() to add a new row of data to a p5.Table object
Removes all rows from a Table
An array containing the names of the columns in the table, if the "header" the table is loaded with the "header" parameter.
Finds the first row in the Table that contains the value provided, and returns a reference to that row
Finds the rows in the Table that contain the value provided, and returns references to those rows
Retrieves a value from the Table's specified row and column
Retrieves all table data and returns it as a multidimensional array.
Retrieves all values in the specified column, and returns them as an array
Returns the total number of columns in a Table.
Retrieves a Float value from the Table's specified row and column
Retrieves all table data and returns as an object
Returns a reference to the specified p5.TableRow
Returns the total number of rows in a Table.
Gets all rows from the table
Retrieves a String value from the Table's specified row and column
Finds the first row in the Table that matches the regular expression provided, and returns a reference to that row
Finds the rows in the Table that match the regular expression provided, and returns references to those rows
Use removeColumn() to remove an existing column from a Table object
Removes a row from the table object.
Removes any of the specified characters (or "tokens").
An array containing the p5.TableRow objects that make up the rows of the table
Stores a value in the Table's specified row and column
Stores a Float value in the Table's specified row and column
Stores a String value in the Table's specified row and column
Trims leading and trailing whitespace, such as spaces and tabs, from String table values
Retrieves a value from the TableRow's specified column
Retrieves a Float value from the TableRow's specified column
Retrieves an String value from the TableRow's specified column
Stores a value in the TableRow's specified column
Stores a Float value in the TableRow's specified column
Stores a String value in the TableRow's specified column
Adds a new child element and returns a reference to it.
Returns the number of attributes the element has.
Returns the first matching child element as a new p5.XML object.
Returns an array with the element's child elements as new p5.XML objects.
Returns the element's content as a String.
Returns the element's name as a String.
Return an attribute's value as a Number.
Returns the element's parent element as a new p5.XML object.
Return an attribute's value as a string.
Returns true if the element has a given attribute and false if not.
Returns true if the element has child elements and false if not.
Returns an Array with the names of the element's attributes.
Returns an array with the names of the element's child elements as Strings.
Removes the first matching child element.
Returns the element as a String.
Sets an attribute to a given value.
Sets the element's tag name.
The system variable accelerationX always contains the acceleration of the device along the x axis
The system variable accelerationY always contains the acceleration of the device along the y axis
The system variable accelerationZ always contains the acceleration of the device along the z axis
The deviceMoved() function is called when the device is moved by more than the threshold value along X, Y or Z axis
The system variable deviceOrientation always contains the orientation of the device
The deviceShaken() function is called when the device total acceleration changes of accelerationX and accelerationY values is more than the threshold value
The deviceTurned() function is called when the device rotates by more than 90 degrees continuously.
The system variable pAccelerationX always contains the acceleration of the device along the x axis in the frame previous to the current frame
The system variable pAccelerationY always contains the acceleration of the device along the y axis in the frame previous to the current frame
The system variable pAccelerationZ always contains the acceleration of the device along the z axis in the frame previous to the current frame
The system variable pRotationX always contains the rotation of the device along the x axis in the frame previous to the current frame
The system variable pRotationY always contains the rotation of the device along the y axis in the frame previous to the current frame
The system variable pRotationZ always contains the rotation of the device along the z axis in the frame previous to the current frame
The system variable rotationX always contains the rotation of the device along the x axis
The system variable rotationY always contains the rotation of the device along the y axis
The system variable rotationZ always contains the rotation of the device along the z axis
The setMoveThreshold() function is used to set the movement threshold for the deviceMoved() function
The setShakeThreshold() function is used to set the movement threshold for the deviceShaken() function
When a device is rotated, the axis that triggers the deviceTurned() method is stored in the turnAxis variable
A String system variable that contains the value of the last key typed.
A Number system variable that contains the code of the last key typed.
Returns true if the key it’s checking is pressed and false if not.
A Boolean system variable that's true if any key is currently pressed and false if not.
A function that's called once when any key is pressed.
A function that's called once when any key is released.
A function that's called once when keys with printable characters are pressed.
A function that's called once when a mouse button is clicked twice quickly.
Exits a pointer lock started with requestPointerLock.
An object that tracks the current state of mouse buttons, showing which buttons are pressed at any given moment.
A function that's called once after a mouse button is pressed and released.
A function that's called when the mouse moves while a button is pressed.
A Boolean system variable that's true if the mouse is pressed and false if not.
A function that's called when the mouse moves.
A function that's called once when a mouse button is pressed.
A function that's called once when a mouse button is released.
A function that's called once when the mouse wheel moves.
A Number system variable that tracks the mouse's horizontal position.
A Number system variable that tracks the mouse's vertical position.
A Number system variable that tracks the mouse's horizontal movement.
A Number system variable that tracks the mouse's vertical movement.
A Number system variable that tracks the mouse's previous horizontal position.
A Number system variable that tracks the mouse's previous vertical position.
A Number variable that tracks the mouse's previous horizontal position within the browser.
A Number variable that tracks the mouse's previous vertical position within the browser.
Locks the mouse pointer to its current position and makes it invisible.
An Array of all the current touch points on a touchscreen device.
A Number variable that tracks the mouse's horizontal position within the browser.
A Number variable that tracks the mouse's vertical position within the browser.
Helpers for create methods.
Creates an <a> element that links to another web page.
AUDIO STUFF *
Creates a <button></button> element.
Creates a <video> element that "captures" the audio/video stream from the webcam and microphone.
Creates a checkbox <input></input> element.
Creates a color picker element.
Creates a <div></div> element.
Creates a new p5.Element object.
Creates an <input></input> element of type 'file'.
Creates an <img> element that can appear outside of the canvas.
Creates a text <input></input> element.
Creates a paragraph element.
Creates a radio button element.
Creates a dropdown menu <select></select> element.
Creates a slider <input></input> element.
Creates a <span></span> element.
Creates a <video> element for simple audio/video playback.
Removes all elements created by p5.js, including any event handlers.
Searches the page for the first element that matches the given CSS selector string.
Searches the page for all elements that matches the given CSS selector string.
Adds a class to the element.
Adds an attribute to the element.
Centers the element either vertically, horizontally, or both.
Calls a function when the element changes.
Attaches the element as a child of another element.
Adds a class attribute to the element using a given string.
Calls a function when the mouse is pressed twice over the element.
Calls a function when a file is dragged off the element.
Calls a function when a file is dragged over the element.
Makes the element draggable.
Calls a function when the user drops a file on the element.
The element's underlying HTMLElement object.
Checks if a class is already applied to element.
A Number property that stores the element's height.
Hides the current element.
Sets the inner HTML of the element, replacing any existing HTML.
Sets the element's ID using a given string.
Calls a function when the element receives input.
Calls a function when the mouse is pressed and released over the element.
Calls a function when the mouse moves over the element.
Calls a function when the mouse moves off the element.
Calls a function when the mouse moves onto the element.
Calls a function when the mouse is pressed over the element.
Calls a function when the mouse is released over the element.
Calls a function when the mouse wheel scrolls over the element.
Attaches the element to a parent element.
Sets the element's position.
Removes the element, stops all audio/video streams, and removes all callback functions.
Removes an attribute from the element.
Removes a class from the element.
Shows the current element.
Sets the element's width and height.
Applies a style to the element by adding a CSS declaration.
Toggles whether a class is applied to the element.
Returns or sets the element's value.
A Number property that stores the element's width.
A string containing the file's data.
Underlying File object
The file name as a string.
The number of bytes in the file.
The file subtype as a string.
The file MIME type as a string.
Schedules a function to call when the audio/video reaches a specific time during its playback.
Sets the audio/video to play once it's loaded.
Removes all functions scheduled with media.addCue().
Sends the element's audio to an output.
Disconnect all Web Audio routing, including to the main output.
Returns the audio/video's duration in seconds.
Hide the default HTMLMediaElement controls.
Plays the audio/video repeatedly in a loop.
Stops the audio/video from playing in a loop.
Calls a function when the audio/video reaches the end of its playback.
Pauses a media element.
Plays audio or video from a media element.
Removes a callback based on its ID.
Show the default HTMLMediaElement controls.
Sets the audio/video playback speed.
Path to the media element's source as a string.
Stops a media element and sets its current time to 0.
Sets the media element's playback time.
Sets the audio/video volume.
Converts a String or Number to a Boolean.
Converts a Boolean, String, or Number to its byte value.
Converts a Number or String to a single-character String.
Converts a String to a floating point (decimal) Number.
Converts a Number to a String with its hexadecimal value.
Converts a Boolean, String, or decimal Number to an integer.
Converts a Boolean or Number to String.
Converts a single-character String to a Number.
Converts a String with a hexadecimal value to a Number.
Removes all items in the web browser's local storage.
Returns a value in the web browser's local storage.
Removes an item from the web browser's local storage.
Stores a value in the web browser's local storage.
Converts a Number into a String with a given number of digits.
Converts a Number into a String with commas to mark units of 1,000.
Converts a Number into a String with a plus or minus sign.
Converts a positive Number into a String with an extra space in front.
Shuffles the elements of an array.
Splits a String into pieces and returns an array containing the pieces.
Turns off the parts of the Friendly Error System (FES) that impact performance.
A function that's called repeatedly while the sketch runs.
Returns true if the draw loop is running and false if not.
Resumes the draw loop after noLoop() has been called.
Stops the code in draw() from running repeatedly.
Runs the code in draw() once.
Removes the sketch from the web page.
A function that's called once when the sketch begins running.
AUTO allows us to automatically set the width or height of an element (but not both), based on the current height and width of the element
A String constant that's used to set the angleMode().
The splineProperty('ends') mode where the first and last points in a spline affect the direction of the curve, but are not rendered.
A Number constant that's approximately 1.5708.
The splineProperty('ends') mode where splines curve through their first and last points.
The default, two-dimensional renderer.
A Number constant that's approximately 3.1416.
A Number constant that's approximately 0.7854.
A Number constant that's approximately 6.2382.
Version of this p5.js.
One of the two render modes in p5.js, used for computationally intensive tasks like 3D rendering and shaders.
One of the two possible values of a WebGL canvas (either WEBGL or WEBGL2), which can be used to determine what capabilities the rendering environment has.
A template for creating objects of a particular type.
Prints a message to the web browser's console.
A way to repeat a block of code when the number of iterations is known.
A named group of statements.
A way to choose whether to run a block of code.
Declares a new variable.
A list that keeps several pieces of data in order.
A value that's either true or false.
A number that can be positive, negative, or zero.
A container for data that's stored as key-value pairs.
A sequence of text characters.
A way to repeat a block of code.
Looking for the old p5.js site? Find it here!