How to fade an image to black over time

I’m a beginner in processing and overall coding, so I’m not really sure what and how I’m supposed to do certain things. Is there a way to fade out an image to black over time or use a tint to make an image black over time?

1 Like

using the TRANSPARENCY example
there is a funny way,
increase the transparency over a black background!

 * Transparency. 
 * modifying the alpha value of the image with the tint() function. 

PImage img;

void setup() {
  size(640, 360);
  img = loadImage("moonwalk.jpg");  // Load an image into the program 
  println("use mouseX"); // tell the user what operation is possible

void draw() {
  background(0);     // BLACK
  tint(255, map(mouseX,0,width,255,0) );    // Display with opacity
  image(img, 0, 0);  // Display 

i know that is not according your assignment, but could help already

1 Like


Resources: See transparency See Color

Examples available with Processing IDE (Files > Examples>…) :


Look up terms like opacity, transparency and alpha.


1 Like

Not exactly what I was looking for, but thank you for answering! :grinning:

cool! I didn’t know there was even a feature like that. I’ll look through them

I have a simple example here:

It was intended to be simple but that depends on the user and their programming skill level.

In a nutshell, the example is modifying the alpha of the color with time; you may want to just increment (or decrement) with each frame or consider using millis(); Processing displays at a default of 60fps.

Remember KISS; Keep It Simple Student and build on that.


Reference / You may want to use RGB (default if not set)
Reference /
Reference /

Have fun!

1 Like

For fading to black:

  • One method is to lower the alpha on an image with a black background, for example using tint as above
  • Another is to create a separate transparent dark layer on top of the image. This works well for mixing a lot of different content – images, lines, text, etc. – which all get faded the same by the darkening screen on top of them. It also doesn’t require a black background.
  • Another is to manipulate the lighting settings in a P3D 3D environment – see the “Lights, Camera” section of the reference.
1 Like