A highly interactive, physics-inspired sticky scroll component for Framer. As users scroll down your page, the topmost card elegantly bends and peels off from the top-right corner—revealing the next card in the deck. It's built entirely natively with `framer-motion` and CSS clip-paths for buttery smooth, 60fps performance without taking over the native browser scroll.
Features & Customization:
- Dynamic Content: Accept arbitrary Framer components (using native Slots) or quickly upload an array of images.
- Tactile Peel Effect: Features a folding sticker flap that mirrors the cut path perfectly, complete with dynamic drop shadows that cast realistic depth onto the underlying cards.
- Customizable Flap: Adjust the back color of the peeling sticker. Supports solid colors or rich Framer gradients.
- Responsive Sizing: Configure exact Card Width and Height controls, with horizontal overflow protection to ensure a perfect fit on mobile devices.
- Alignment: Control the alignment (X and Y) of the card deck within the viewport.
- Accessibility: Includes a robust "Disable Animation" toggle, allowing the component to fall back to a static layout for accessibility and performance.
A highly interactive, physics-inspired sticky scroll component for Framer. As users scroll down your page, the topmost card elegantly bends and peels off from the top-right corner—revealing the next card in the deck. It's built entirely natively with `framer-motion` and CSS clip-paths for buttery smooth, 60fps performance without taking over the native browser scroll.
Features & Customization:
- Dynamic Content: Accept arbitrary Framer components (using native Slots) or quickly upload an array of images.
- Tactile Peel Effect: Features a folding sticker flap that mirrors the cut path perfectly, complete with dynamic drop shadows that cast realistic depth onto the underlying cards.
- Customizable Flap: Adjust the back color of the peeling sticker. Supports solid colors or rich Framer gradients.
- Responsive Sizing: Configure exact Card Width and Height controls, with horizontal overflow protection to ensure a perfect fit on mobile devices.
- Alignment: Control the alignment (X and Y) of the card deck within the viewport.
- Accessibility: Includes a robust "Disable Animation" toggle, allowing the component to fall back to a static layout for accessibility and performance.
