Convert an Image to Grayscale

Solve It

The color white has red, green, and blue values all set to 255, and the color black has red, green, and blue values all set to 0. In general, when all three color values are equal, the result is some shade of gray. In this example we create a grayscale version of an image by setting all color components of each pixel to the same value. The value we use is the average of the original three color component values.

Code It

// gray scale var flower = new SimpleImage("eastereggs.jpg"); for (var p of flower.values()) { var avg = (p.getGreen() + p.getRed() + p.getBlue()) / 3; p.setRed(avg); p.setBlue(avg); p.setGreen(avg); } print(flower);

See It

 
 

Available Images


duke_blue_devil.png
[397x337]

eastereggs.jpg
[615x410]

hippieflower.jpg
[5616x3744]

Drop your images onto the area above to make it available within your code editor on this page. Note: your images will not be uploaded anywhere, they will stay on your computer.