Click the image to apply the filter. Move the scroll bar to see all filters.
Applied filter: {{ filterName }}
.mask-custom {
backdrop-filter: contrast(110%) brightness(110%) saturate(130%);
mix-blend-mode: screen;
background: rgba(243, 106, 188, 0.3);
opacity: 1;
}
<div class="bg-image">
<img
src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp"
class="w-100"
alt="Louvre"
/>
<div class="mask mask-custom">
<div class="d-flex justify-content-center align-items-center h-100">
<h3 class="text-white mb-0">Can you see me?</h3>
</div>
</div>
</div>
Filters
How to use it?
1. Download MDB 5 - free UI KIT
2. Create the filter you like
3. Copy the generated code and paste it into the MDB project
