The Green Screen

LIVE: https://mustafa-sadiq.github.io/green-screen-problem/

Load images then click "Solve"

You can also click "Load demo images" to load test images

To save the result image: Right click on the image --> Save image as...

Background:

The green screen has been used commonly to change the background of images in post-production. Given a picture with a green background we can change every pixel corresponding to a background image to produce a new image. Learning from Duke Learn to Program's Programming Foundations with JavaScript, HTML and CSS (https://www.dukelearntoprogram.com//course1/index.php).

Tools:

• HTML
• CSS
• JavaScript
• Bootstrap
• JavaScript
• Duke Learn to Program SimpleImage JavaScript library (https://www.dukelearntoprogram.com//downloads/openSourceJS.php?course=1)