Thursday, January 22, 2026
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
32475 POSTS0 COMMENTS
Milvus
119 POSTS0 COMMENTS
Nango Kala
6847 POSTS0 COMMENTS
Nicole Veronica
11977 POSTS0 COMMENTS
Nokonwaba Nkukhwana
12064 POSTS0 COMMENTS
Shaida Kate Naidoo
6986 POSTS0 COMMENTS
Ted Musemwa
7220 POSTS0 COMMENTS
Thapelo Manthata
6933 POSTS0 COMMENTS
Umr Jansen
6912 POSTS0 COMMENTS