Lean

Static CSS rotation that snaps back to 0deg with a slight lift when hovered or focused. Useful for resting card tilts where pointing at a tile "fixes" the angle. Pure CSS — respects prefers-reduced-motion.

-1.5°

1.2°

-0.8°

1.8°

Usage

import { Lean, Card } from '@bwo-ui/react';

<div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: 12 }}>
  <Lean angle={-1.2}><Card>Card A</Card></Lean>
  <Lean angle={ 1.5}><Card>Card B</Card></Lean>
  <Lean angle={-0.8}><Card>Card C</Card></Lean>
</div>

Props

Prop	Type	Default	Description
`angle`	`number`	—	Resting rotation in degrees. Snaps to 0deg on hover/focus.
`as`	`ElementType`	`'div'`	Element to render.