Source: https://www.flickr.com/photos/beateknappe/374485447/in/photostream/

​

Related:

https://p5js.org/reference/#/p5/preload

https://p5js.org/reference/#/p5/loadImage

https://p5js.org/reference/#/p5/image

https://p5js.org/reference/#/p5/imageMode

​

https://p5js.org/examples/image-load-and-display-image.html

https://p5js.org/examples/image-transparency.html

​

See blur example on this page:

https://p5js.org/reference/#/p5/filter

*/

​

let pic;

​

function preload() {

  pic = loadImage("kahlo_326x_458h.jpg");

}

​

function setup() {

  createCanvas(400, 400);

  // OR

  // createCanvas(pic.width, pic.height);

}

​

function draw() {

  background(220);

​

  image(pic, 0, 0);

  // the above is the same as:

  // image(pic, 0, 0, pic.width, pic.height);

  // OR, one way to adjust scale of image:

  image(pic, 0, 0, pic.width/4, pic.height/4);

}

​