Mask Effect

This repo shows a simple implementation of the mask effect with an added interactive feature that moves the mask with the mouse position.

Demo

Vite.+.React.and.15.more.pages.-.Personal.-.Microsoft.Edge.2024-10-10.00-02-34.mp4

Setup

• Clone the repo.
• cd to root maskeffect.
• npm install.
• npm run dev after installing dependencies to run dev server.

Compatibility

Note

Current version of chrome doesn't support mask-repeat fully so this might show up as multiple masks. Edge browser works better with this feature. Developers working on this can try webkit-mask-repeat