Chromatic aberration that jitters on hover. Works on images, text, anything.
npx shadcn@latest add https://hyperblur.dev/r/chromatic-hover.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/chromatic-hover.tsx.
import { ChromaticHover } from "@/components/hyperblur/chromatic-hover"
<ChromaticHover><img src="/cover.png" /></ChromaticHover>| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | required | What to wrap. |
| strength | number | 3 | Offset of the color fringes in pixels. |
| always | boolean | false | Run without hover. |