Auth forms5NewPro
Five card-sized auth forms — sign in, sign up with live strength, magic link, one-time code and a three-step reset — with inline validation, a shake on error and crossfading success states.
Real-world UI
Examples
Finished product patterns you copy in one click: cards, chats, charts, forms, menus and widgets, each a single file that works without props.
28 results
Billing and usage3NewPro
Billing cards for SaaS settings — usage meters with thresholds and projections, seats and spend with a priced seat stepper, and a credits balance with top-up packs — that fill, count and spring.
Blog cards4New
Four ways to present a post — editorial cover, compact list, featured series and author-led quote — each with its own motion moment, from layered parallax to a gliding row highlight.
Booking cards3NewPro
Stay, flight and restaurant booking cards — live price breakdowns with a counting total, a plane that flies a drawn route and time slots that update with party size.
Chat bubbles4New
Four message threads — support with typing indicator, group chat with reactions, file and voice attachments, and delivery receipts — where every new message springs in.
Comment threads3NewPro
Three comment patterns — threaded replies, inline document comment and @mention composer — with collapsing threads, resolving highlights and a keyboard-driven mention list.
Date pickers4NewPro
Four hand-built date pickers for real jobs — a stay range with nights and price, a deadline with quick picks, a recurring schedule and an appointment slot finder — with months that slide and selections that spring.
Ecommerce charts4NewPro
Store analytics drawn in plain SVG and HTML — revenue area, orders by channel, conversion funnel and top products — that draw in, spring between periods and explain every point on hover or arrow keys.
Event cards3NewPro
Event RSVP, day agenda and meeting countdown cards — a sliding RSVP control you join with a spring, a live now marker and a rolling countdown that goes live at zero.
Feedback widgets3NewPro
NPS survey, drawn face rating and bug report widgets — a follow-up that adapts to the score, a face that morphs as you hover and a screenshot capture with a shutter flash.
Integration cards3New
App connect grid, single-integration consent and sync health cards — optimistic connect, spring permission switches and a failed sync that heals on retry.
Invoice cards3NewPro
Invoice summary, printed receipt and payout statement cards — each with a money moment: counting totals, a print-in receipt and an optimistic mark-as-paid stamp.
Line charts4New
Four hand-drawn SVG line charts — multi-series, single metric, period comparison and annotated steps — that reveal left to right, morph with springs and read out values on hover or arrow keys.
Media players3NewPro
Music, podcast and video player chrome with simulated playback — drawn cover art, chaptered progress, speed control and a scene that pans as the video plays.
Notification cards4NewPro
Four notification patterns — inbox with tabs, actionable access request, stacked toasts and grouped digest — with sliding tabs, optimistic read states, fanning stacks and springy groups.
Order tracking3NewPro
Post-purchase tracking — a shipment stepper with ETA, an SVG route map with a gliding van and a full event timeline with delays — that fill, glide and expand with springs.
Payment methods3NewPro
Three checkout pieces — saved-card picker, add-card form with a flipping live preview and a method selector with animated fees — built for the moment money moves.
Product cards5NewPro
Five storefront pieces — swatch card, quick-add card, bag row, bundle deal and compact ranked list — with recolouring products, rolling quantities and rows that glide to a new sort.
Project charts3NewPro
Delivery charts for product teams — sprint burndown, velocity and a milestone timeline — with honest status, a today marker and per-point detail on hover, focus or arrow keys.
Review cards5New
Five review cards — rating summary, standout quote, review composer, compact list and photo review — with count-ups, star pops, rolling vote counts and a shared-element photo viewer.
Social posts4New
Four feed posts — text, photo grid, poll and link preview — with optimistic toggles, rolling counts, a shared-layout photo viewer and results that count up.
Stat cards4New
Four metric cards — headline KPI, scrubbable sparkline, goal ring and two-period comparison — with count-ups, redrawn lines, springing arcs and bars.
Switch cards3New
Three settings cards built on a springy switch — notification preferences with a saved cue, plan features with dependent options and a save bar, and privacy toggles that ask before turning protection off.
Task cards3NewPro
Three task cards — subtask checklist, board card with status menu, and focus timer — with drawn ticks, lifting cards, fanning avatars and rolling digits.
Team invites3NewPro
Invite-by-email, share dialog and pending invites — address chips with validation and seat projection, link access that explains itself and revoke with a timed undo.
Theme switchers3New
Three appearance controls — a light/dark/system segmented switch with a sliding thumb, an appearance card with live mini previews, and an accent and density picker — that report changes without touching your site.
User menus3New
Three account menus — an avatar dropdown with workspace switcher and theme row, a sidebar footer menu that opens upward, and a searchable command-style profile menu — each springing from its trigger.
Welcome cards3New
Three dashboard welcome cards — today at a glance, onboarding checklist and what’s new — with staggered count-ups, one-at-a-time steps and a swipeable release carousel.