p5.js | style() Function

p5.js setBlue() Function

Last Updated : 04 Oct, 2024

The setBlue() function in p5.js is used to set the blue color value in RGB color mode. It sets the third value of the RGB format.

Syntax:

setBlue(blue)

Parameters:

The function accepts a single parameter as mentioned above and described below:

blue: This parameter stores the new blue value.

Example 1: This example uses setBlue() function to set the red value of the RGB color format.

JavaScript

// Declare a variable to store the value of color
let backgroundColor;

function setup() {
  // Create Canvas of a given size (should be in setup to run once)
  createCanvas(500, 500);

  // Initialise the variable with RGB color format
  backgroundColor = color(13, 40, 0);
}

function draw() {
  // Use of setBlue function to change the blue channel dynamically
  backgroundColor.setBlue(0 + 128 * cos(millis() / 1000));

  // Pass the initialised variable to background function
  background(backgroundColor);

  // Set text size
  textSize(30);

  // Set text color
  fill("white");

  // Display the text
  text("GeeksForGeeks", 125, 125);
}

Output:

Example 2: This example uses setBlue() function to set red value of RGB color format.

javascript

// Declare a variable to store the value of color 
let backgroundColor;

function setup() {
  // Create Canvas of a given size 
  // (should be done in setup to run once)
  createCanvas(540, 500);

  // Initialise the variable with RGB color format
  backgroundColor = color(0, 0, 0);
}

function draw() {
  // Set the blue channel to its maximum value
  backgroundColor.setBlue(255);

  // Use the background color for the canvas background
  background(backgroundColor);

  // Set text size
  textSize(30);

  // Set text color
  fill("white");

  // Display the text with line breaks
  text("GeeksForGeeks\nA Computer Science Portal For Geeks", 10, 125);
}

Output:

p5.js | style() Function

sarthak_ishu11

Improve

Article Tags :

Similar Reads

p5.js | setBuffer() Function

The setBuffer() function is an inbuilt function in p5.js library. This function is used to reset the buffer with the current buffer. Syntax: setBuffer( buf ) Note: All the sound-related functions only work when the sound library is included in the head section of the index.html file. Parameter: This

p5.js | setVolume() Function

The setVolume() function is an inbuilt function in p5.js library. This function is used to control the volume of the played audio on the web. This function has a range of between (0.0) which means total silence to (1.0) which means full volume. This volume also can be controllable by a slider var by

p5.js setup() Function

The setup() function runs when the program starts. It is used to set the initial environment properties such as text-color, screen size, background-color and load the media file such as images and fonts. The program contains only one setup() function. The setup() function can not be called again aft

p5.js | style() Function

The style() function is used to set the style property of an element with the given value. If this function contains single parameter then use .style() function to return the value of the given property. Note: This function requires the p5.dom library. So add the following line in the head section o

p5.js setRed() Function

The setRed() function in p5.js is used to set the red color value in RGB color mode. It sets the first value of RGB format. Syntax:setRed(red)Parameters:red: This parameter stores the new red value.Example 1: This example uses setRed() function to set red value of RGB color format. javascript/* decl

p5.js | setLoop() Function

The setLoop() function is an inbuilt function in p5.js library. This function is used to play the audio on the web in a loop where you can change the value when the loaded sound is playing and that will affect when it reaches the end of the current playback. Syntax: setLoop( Boolean ) Note: All the

p5.js | value() Function

The value() function is an inbuilt function which is used to set or return the value of the element.This function requires p5.dom library. So add the following line in the head section of the index.html file.Â Â javascript <script language="javascript" type="text/javascript" src="path/to/p5.dom.js

p5.js str() function

The str() function in p5.js is used to convert the given boolean, string and number value into its string representation. Syntax: str(value) Parameters: This function accepts single parameter value which is to be converted into its string representation. This value might be integer, float, string, b

p5.js setGreen() Function

The setGreen() function in p5.js is used to set the green color value in RGB color mode. It sets the second value of the RGB format. Syntax:setGreen(green)Parameters: The function accepts a single parameter as mentioned above and described below: green: This parameter stores the new green value.Exam

p5.js stroke() Function

The stroke() function is used to draw the lines and border around the text and shapes. The color object can be set in terms of RGB or HSB depending on the color mode. The color object can also be set as string in terms of RGB, RGBA, Hex CSS color or named color string. Syntax: stroke( v1, v2, v3, al