A super simple way to create Cut-Out text effect using pure CSS

Here is a very cool effect in CSS!

👉 The mix-blend-mode property is used to define how the background and foreground of an element blend together.

👉 In the screen mode, the black color of the text cancels out the white background and makes the text segment transparent.

✨ HTML used in this example:

✨ Using tailwindcss, you can control how elements blend with backgrounds using Mix Blend Mode Utilities.

Let’s get connected! You can find me on:
- Medium: https://medium.com/@nhannguyendevjs/
- Dev: https://dev.to/nhannguyendevjs/
- Substack: https://nhannguyendevjs.substack.com/
- Linkedin: https://www.linkedin.com/in/nhannguyendevjs/
- X (formerly Twitter): https://twitter.com/nhannguyendevjs/