depth parallax

v1.0.10

WebGL depth-map parallax for React.

Image
Image
Depth map
Depth map

Installation

$ npm install react-depth-parallax

Usage

App.tsx
import { ParallaxProvider, DepthCard } from "react-depth-parallax";
 
export default function App() {
  return (
    <ParallaxProvider>
      <DepthCard src="/image.jpg" depthSrc="/depth.png" />
    </ParallaxProvider>
  );
}

Playground

Invert
DepthCard
<DepthCard
  src="/image.jpg"
  depthSrc="/depth.png"
  strength={1.4}
  invert={false}
  depthScale={1.0}
/>