PIXLIFY / COMPONENTS LAB
PREMIUM COMPONENT · BY PIXLIFY
CARDS · SPRINGS · THROW
Flick the top card away and it tucks itself under the pile. Click and the whole deck springs into a fan, a grid or a draggable carousel, with a glass counter pill and a plus that turns into a close icon.
LIVE PREVIEW - THROW THE TOP CARD, THEN CLICK THE PILE
TAB TO FOCUS · ← → THROWS OR SWIPES · ENTER OPENS · ESC CLOSES
VARIANTS & PRESETS
01 - GRID
Grid · architecture set
The pile opens into a balanced grid that always fits the frame.
02 - CAROUSEL
Carousel · drag with momentum
Swipe or drag, the deck snaps to the nearest card. Arrow keys work too.
03 - LIGHT
Fan · light background
Square cards, no captions, a light glass pill on a paper background.
04 - MESSY
Stack · extra messy and bouncy
More tilt on the pile and a looser spring for a playful throw.
HOW TO USE
01
Insert Stack Deck
Drag it onto the canvas. 520 × 460 px is a good start; the cards scale to fit the frame in every layout.
02
Add cards
Add up to 12 cards in Cards, each with an image, title, caption and optional link.
03
Pick a layout
Fan opens the deck in an arc, Grid lays it out in rows, Carousel turns it into a draggable strip.
04
Shape the cards
Size, ratio, radius, gap, messiness of the pile and fan spread.
05
Style the pill
Label text, glass blur, tint and border, text and button colours. Or hide the pill.
06
Tune the springs
Stiffness, damping and stagger. Lower damping gives more bounce.
PROPERTY CONTROLS
Layout
Fan · Grid · Carousel.
Cards
Up to 12 cards with image, title, caption and link.
Label / Pill / Captions
Counter text, show or hide the glass pill and captions.
Throw
Drag the top card to send it to the back of the pile.
Card
Size, ratio, radius, gap, messiness and fan spread.
Pill Glass
Blur, tint and border of the counter pill.
Colors
Text, muted text, button, icon and shadow strength.
Spring
Stiffness, damping and stagger in ms.
Start / Canvas
Start stacked or open, and preview either state while designing.
Font / Events
Typography plus On Open and On Close events.
PERFORMANCE
Transforms only, one blur layer for the pill and an animation loop that sleeps as soon as the springs settle.
MOBILE
Swipe the top card to throw it, tap to open, swipe the carousel. Vertical scrolling still works over the deck.
ACCESSIBILITY
Keyboard focus, arrow keys to throw or swipe, Enter to open, Escape to close. Reduced motion removes the bounce.
© 2026 PIXLIFY - MADE IN WARSAW
STACK DECK · PREMIUM COMPONENT · BY PIXLIFY