Fintech Island
A Dynamic Island–style pill that morphs into a full status tray for sends, card additions, and savings deposits.
dynamic-islandmorphlottie
Back
All Components
Every interaction in the ZAYX library.
FinPanel
An edge-swipe quick actions drawer with a second swappable insights page and staggered entrance animations.
edge-swipedrawerstagger
Piggy Bank
A gravity-driven savings drop animated coins fall from your quick-amount pad into a reactive piggy bank.
physicsgravityhapticsspring
Crypto Orbit
A gesture-driven crypto pay button with an orbiting arc of coins. Press and hold to reveal a fan of crypto coin bubbles — drag to hover over any coin, release to select. Each bubble springs out with a staggered reveal, glows and scales when hovered, and the whole interaction runs entirely on the UI thread via a single worklet-side distance check.
radial-menupress-holdgesture
Payment Reminder
A draggable reminder pill that morphs seamlessly into a full reminders sheet. Set a payment reminder in a modal sheet — pick a contact, date, month, and amount, hit 'Remind me' and it collapses into a floating draggable pill. Tap the pill and it grows directly into the reminders list using a headless morph-box primitive — no second modal, no popover, just the pill expanding into the sheet it already is.
morphavatar-carouselhaptics
QuickPay Interaction
A polished quick-pay interaction with avatar carousel, haptic slider, and animated transaction states.
bottom-sheetslidercarousel
Coins Screen Transition
A tap-to-fullscreen coin morph with seamless shared-element transitions. Tap a coin in a scrollable list and it springs from its exact on-screen position into a large floating detail view — no hardcoded coordinates, correct even mid-scroll. Closing squashes the coin back to its origin with a spring rebound instead of snapping back flat.
shared-elementmorphspring
Coin Reward
Drag-to-spin coin toss with a Skia scratch card reveal.
scratch-cardskiacoin-flip
Currency Switcher
A fluid fintech currency switcher with live exchange rates, bidirectional inputs, and spring-driven interactions.
exchange-ratebidirectionalspring
Card Insight
A drag-to-flip 3D card with swipe paging and spending insights on the back.
3d-flipskiaswipeshader