pleate.uiEffects
Animations

Sticker Peel

A sticker you can drag around. Hover lifts its corner into a curl that shows the backing.
import { StickerPeel } from "pleate/effects/sticker-peel";

Stickers

Drag them, hover to peel.

Photo sticker of a beach

Props

children

The sticker face.

ReactNode

width

Width (px).

numberdefault 180

peel

Corner lift on hover, fraction of width.

numberdefault 0.28

rotate

Starting rotation (deg).

numberdefault -6

backColor

Backing color.

stringdefault #e9e9ee

dragConstraints

Box that bounds dragging.

RefObject

Accessibility

  • Give the face its own label (img alt or an SVG with aria-label).
  • Dragging is pointer only.
  • Reduced motion keeps the corner down.