Example 1:

Source code 1:

<figure class="image-overlay">
<img class="image-one-overlay" src="_Dsc2008.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.8; filter: contrast(150%) brightness(150%)" src="_Dsc2013.jpg" alt="..." />
<figcaption>my example 1 with 'double exposure effect'</figcaption>
</figure>

Example 2:

Source code 2:

<figure class="image-overlay">
<img class="image-one-overlay" src="_Dsc2450.jpg" alt="..." />
<img class="image-two-overlay" style="filter: grayscale(50%)" src="_Dsc2455.jpg" alt="..." />
<figcaption>my example 2 with 'double exposure effect'</figcaption>
</figure>

Example 3:

Source code 3:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.7; filter: contrast(145%) brightness(115%)" src="_Dsc9522.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.5; filter: contrast(145%) brightness(115%)" src="_Dsc9523.jpg" alt="..." />
<figcaption>my example 3 with 'double exposure effect'</figcaption>
</figure>

Example 4:

Source code 4:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.8; filter: contrast(125%) brightness(125%)" src="_Dsc9538.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.6; filter: contrast(125%) brightness(125%)" src="_Dsc9539.jpg" alt="..." />
<figcaption>my example 4 with 'double exposure effect'</figcaption>
</figure>

Example 5:

Source code 5:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.8; filter: contrast(130%) brightness(115%)" src="_Dsc2330_01.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.6; filter: contrast(130%) brightness(115%)" src="_Dsc2330_02.jpg" alt="..." />
<figcaption>my example 5 with 'double exposure effect' / '3D Effect'</figcaption>
</figure>

Example 6:

Source code 6:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.8; filter: contrast(130%) brightness(115%)" src="_Dsc2336_01.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.6; filter: contrast(130%) brightness(115%)" src="_Dsc2336_02.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.4; filter: contrast(130%) brightness(115%)" src="_Dsc2336_03.jpg" alt="..." />
<figcaption>my example 6 with 'triple exposure effect' / '3D Effect'</figcaption>
</figure>

Example 7:

Source code 7:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.8; filter: contrast(150%) brightness(150%); transform:rotateY(0deg)" src="images/_Dsc2013.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.6; filter: contrast(150%) brightness(150%); transform:rotateY(180deg)" src="images/_Dsc2013.jpg" alt="..." />
<figcaption>my example 7 with 'triple exposure effect' / 'Horizontally Mirroring Effect'</figcaption>
</figure>

Example 8:

Source code 8:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.8; filter: contrast(180%) brightness(90%); transform:rotateX(0deg)" src="images/_Dsc2274.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.6; filter: contrast(180%) brightness(90%); transform:rotateX(180deg)" src="images/_Dsc2274.jpg" alt="..." />
<figcaption>my example 8 with 'double exposure effect' / 'Vertically Mirroring Effect'</figcaption>
</figure>

Example 9:

Source code 9:

<figure class="image-overlay">
<img class="_image-one-overlay slider" style="_opacity: 0.8; filter: contrast(150%) brightness(130%) _grayscale(10%)" src="images/_Dsc2097.jpg" alt="..." />
<img class="_image-one-overlay slider" style="_opacity: 0.8; filter: contrast(150%) brightness(130%) _grayscale(10%)" src="images/_Dsc2271.jpg" alt="..." />
<img class="_image-one-overlay slider" style="_opacity: 0.8; filter: contrast(150%) brightness(130%) _grayscale(10%)" src="images/_Dsc2274.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.7; filter: contrast(150%) brightness(130%); mix-blend-mode: lighten" src="images/-Dsc2288.jpg" alt="..." />
<figcaption>my example 9 with 'double exposure effect' / 'Animation Effect on the background'</figcaption>
</figure>

Example 10:

Source code 10:

<figure class="image-overlay">
<img class="image-one-overlay" style="opacity: 0.8; filter: contrast(180%) brightness(90%); transform:rotateZ(0deg); filter: blur(2px)" src="images/_Dsc8763.jpg" alt="..." />
<img class="image-two-overlay" style="opacity: 0.6; filter: contrast(180%) brightness(90%); transform:rotateZ(180deg)" src="images/_Dsc8703.jpg" alt="..." />
<figcaption>my example 10 with 'double exposure effect' / 'Horizontally & Vertically Mirroring Effect'</figcaption>
</figure>