A few details people usually ask about:

- The phone is a real photo of a hand. The listing app sits inside its screen using percentage insets (left 38.4%, right 35.6%, top 2.8%, bottom 13.2%), so it scales with the photo at every size. It swaps homes every 4.2 s, and room cards fly out to fixed spots around it.

- The mortgage is the real fixed-rate amortisation formula: loan × r / (1 − (1 + r)^−n). There's a 15/30-year switch, the price slider moves in $5k steps and the deposit runs 5–40%.

- The sliders are native range inputs, so keyboard and screen readers work for free. - With reduced motion the phone shows the first home and holds still.

Feel free to copy if it's useful: https://ui.deliverwebsite.com/components/landing-pages/real-estate-landing-page-template/

Feedback on the design is very welcome.

Free

How it works, since people usually ask:

• The odometer: each digit is its own reel of 0–9 stacked vertically, and it slides to y = −digit × 10% with a 0.9s ease-out. Commas and the $ sign never move, only digits roll. Screen readers get the plain value through an sr-only span.
• The balance and the feed share one tick (every 3.4s): a new transaction slides in at the top of the feed and the balance is recomputed from the ledger, so the two can never disagree.
• The payout is a tiny state machine: Sent → Converted → Arrived, 1.1s per step, then it holds 2.6s and starts over.
• On wide screens it's a staggered bento that runs off the fold, on tablets 2×2, on phones a swipeable row. With reduced motion everything holds still.

Free to copy if it's useful: https://ui.deliverwebsite.com/components/hero-sections/fintech-hero-section-with-gradient-cards/

Feedback on the motion very welcome. I'm trying to make every animation say something about the product