Saturday, August 30, 2025
HomeLanguagesJavascriptp5.js background() function

p5.js background() function

The background() function in p5.js is used to set the color used for the background of the p5.js canvas. The default background is transparent. The color accepted by this function can be of the RGB, HSB, or HSL color depending on the current colorMode.

Syntax:

background(c)

Parameters: This function accepts single parameter c which stores the p5.Color object, color components, or CSS color.

Below programs illustrate the background() function in p5.js:

Example 1: This example uses background() function to set the background color.




function setup() {
      
    // Create Canvas of size 300*300
    createCanvas(300, 300);
}
  
function draw() {
    background(220, 141, 155); //RGB Value
}


Output:

Example 2: This example uses background() function to set the background color.




function setup() {
      
    // Create Canvas of size 300*300
    createCanvas(300, 300);
}
  
function draw() {
      
    // Set background color to green
    background('green');
}


Output:

Reference: https://p5js.org/reference/#/p5/background

Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
RELATED ARTICLES

Most Popular

Dominic
32249 POSTS0 COMMENTS
Milvus
81 POSTS0 COMMENTS
Nango Kala
6617 POSTS0 COMMENTS
Nicole Veronica
11792 POSTS0 COMMENTS
Nokonwaba Nkukhwana
11838 POSTS0 COMMENTS
Shaida Kate Naidoo
6731 POSTS0 COMMENTS
Ted Musemwa
7012 POSTS0 COMMENTS
Thapelo Manthata
6689 POSTS0 COMMENTS
Umr Jansen
6701 POSTS0 COMMENTS