Styled Component + Framer Motion

Posted on Fri, Feb 26, 2021

<MyComponent as={motion.div} animate={{ y: 100 }} />

const MyCustomComponent = styled(motion.div)`
  width: 2rem;
  background-color: tomato;
`;

<div>
  <MyCustomComponent drag />
  <MyCustomComponent animate={{ opacity: 1 }} />
</div>