Skip to content

Hermanya/use-3d-effect

Repository files navigation

use-3d-effect

NPM JavaScript Style Guide

screencast

Demo

Install

npm install --save use-3d-effect

Usage

import * as React from 'react'
import { animated } from 'react-spring';
import { use3dEffect } from 'use-3d-effect';

const Example = () => {
  const ref = React.useRef(null);
  const {style, ...mouseHandlers} = use3dEffect(ref);

  return (
    <animated.div
      ref={ref}
      style={{
        background: '#61dafb', color: 'white', padding: '2em',
        ...style
      }}
      {...mouseHandlers}
    >
      Hover over me!
    </animated.div>
  );
};

License

MIT © Hermanya


This hook is created using create-react-hook.

About

🃏React hook that adds the 3D tilt card effect to any component.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published