Tuesday, November 18, 2025
HomeLanguagesJavascriptp5.js cursor() Function

p5.js cursor() Function

The cursor() function in p5.js is used to set the cursor to a predefined symbol or an image or it makes visible if already hidden. To set an image as the cursor, the recommended size is 16×16 or 32×32 pixels. The values for parameters x and y must be less than the dimensions of the image.

Syntax:

cursor(type, x, y)

Parameters: This function accepts three parameters as mentioned above and described below:

  • type: This parameter stores the type of cursor like ARROW, CROSS, HAND, MOVE, TEXT and WAIT Native CSS properties: ‘grab’, ‘progress’, ‘cell’ etc. External: path for cursor’s images (Allowed File extensions: .cur, .gif, .jpg, .jpeg, .png).
  • x: This parameter stores the horizontal active spot of the cursor.
  • y: This parameter stores the vertical active spot of the cursor.

Below program illustrates the cursor() function in p5.js:

Example: This example uses cursor() function to display the cursor.




function setup() {
    
    // Create canvas
    createCanvas(400, 400);
      
    // Set the text size
    textSize(40); 
      
    // Set the text alignment
    // to center
    textAlign(CENTER);
}
  
function draw() {
}


Output:

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

RELATED ARTICLES

Most Popular

Dominic
32402 POSTS0 COMMENTS
Milvus
95 POSTS0 COMMENTS
Nango Kala
6772 POSTS0 COMMENTS
Nicole Veronica
11921 POSTS0 COMMENTS
Nokonwaba Nkukhwana
11992 POSTS0 COMMENTS
Shaida Kate Naidoo
6899 POSTS0 COMMENTS
Ted Musemwa
7156 POSTS0 COMMENTS
Thapelo Manthata
6853 POSTS0 COMMENTS
Umr Jansen
6845 POSTS0 COMMENTS