# How to add images?

**URL:** https://discourse.processing.org/t/how-to-add-images/43963
**Category:** Coding Questions
**Created:** [February 20, 2024, 4:39pm UTC](https://discourse.processing.org/t/how-to-add-images/43963 "2024-02-20T16:39:51Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![WillyGrz](https://avatars.discourse-cdn.com/v4/letter/w/c77e96/32.png) [@WillyGrz](https://discourse.processing.org/u/WillyGrz)
#### Post date: [February 20, 2024, 4:39pm UTC](https://discourse.processing.org/t/how-to-add-images/43963/1 "2024-02-20T16:39:51Z")

</div>

Hey, i’m only a few moths in but can’t figure out how to load images. All tutorials I see on this are either from a different processing like 3, or I can’t understand.  
They have a bunch of folders to put it into, and I just get confused. And tips?

---

<div class="post-metadata">

### Author: ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)
#### Post date: [February 20, 2024, 5:04pm UTC](https://discourse.processing.org/t/how-to-add-images/43963/2 "2024-02-20T17:04:02Z")

</div>

Hello @WillyGrz,

See the section _Loading and displaying data_ :

> **[Processing Overview](https://processing.org/tutorials/overview/)**
>
> A little more detailed introduction to the different features of Processing than the Getting Started tutorial.

> **[loadImage() / Reference](https://processing.org/reference/loadImage_.html)**
>
> Loads an image into a variable of type PImage. Four types of images ( .gif, .jpg, .tga, .png) images may be loaded. To load correctly, images must be located in the …

Be sure to check out related references as well!

`:)`

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [February 21, 2024, 5:23pm UTC](https://discourse.processing.org/t/how-to-add-images/43963/3 "2024-02-21T17:23:08Z")

</div>

when you are in processing, hit ctrl-k to open your folder.

Here you can place your images. Name it `shells.jpg` (place it in the folder or create a new folder _data_ and place it there).

then you can say:

```auto
size(400,400);
PImage img;
img = loadImage("shells.jpg");
image(img, 0, 0);

```

When you have a program with **setup() and draw()** you want:

```auto
PImage img; // global scope 

void setup() {
  size(400,400);
  img = loadImage("shells.jpg"); // load 
}

void draw() {
  image(img, 0, 0); // use 
}

```

this means, load once, use often which is much more efficient than to load in draw().

* * *

When you have images in different folders you need to **give the full path.**

```auto

final String pathImg = "D:\\texts\\img.jpg"; // path 

PImage img; // global scope

//-------------------------------------------------------

void setup() {
  size(1400, 800);
  img = loadImage(pathImg); // load
}

void draw() {
  image(img, 0, 0); // use
}

```

you can also have a list / array of images
