Install and use the Mask

An SVG mask that cover all the window contents except the one specified by certain position and sizes values

Install @reactour/mask (opens in a new tab)

npm i @reactour/mask

Usage

import { Mask } from '@reactour/mask'
 
function App() {
  const sizes = {
    width: 100,
    height: 100,
    top: 100,
    left: 100,
  }
 
  return (
    <>
      {/* ... */}
      <Mask sizes={sizes} />
    </>
  )
}

Examples Mask props