I did some searching and could not find any no ready made solution to what you are looking for.
It's certainly possible to make something that uses the html5 canvas element to composite all your light select elements together into one combined image. If you are feeling ambitious, then code some sliders to change the opacity and redraw the canvas whenever the slider is moved. Tinting would be harder to accomplish and have it look good, I would have to think about that some more. Here is some code to load the images and then composite on top of each other. Don't really have time to build the sliders part though.
<html>
<head>
</head>
<body>
<canvas width="800" height="1200" id="canvas"></canvas>
<script type="text/javascript">
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var img1 = loadImage('image1.jpg', main);
var img2 = loadImage('image2.jpg', main);
var img3 = loadImage('image3.jpg', main);
var imagesLoaded = 0;
function main() {
imagesLoaded += 1;
if(imagesLoaded == 3) {
ctx.globalCompositeOperation = "screen";
ctx.globalAlpha = 1;
ctx.drawImage(img1, 0, 0);
ctx.globalAlpha = 1;
ctx.globalAlpha = 1;
ctx.drawImage(img2, 0, 0);
ctx.globalAlpha = 1;
ctx.drawImage(img3, 0, 0);
}
}
function loadImage(src, onload) {
var img = new Image();
img.onload = onload;
img.src = src;
return img;
}
</script>
</body>
</html>
you would change the globalAlpha values to change the contributions of each individual image
