Production-ready UI blocks for landing pages, dashboards, and web apps.
Wine estate footer with wine collection categories, tasting room hours, experience links, award badges, and booking button. Perfect for wineries, vineyards, and breweries.
Saved items list with stock status, quick add to cart, and remove actions. Includes empty state with call to action. Perfect for user dashboards and saved items pages.
Accordion followed by a call-to-action card below. Great for converting users by offering additional contact options at the end.
Footer with a CTA row, then a bordered card holding the brand, a statement heading, a back-to-top link, three link columns, copyright, and an oversized wordmark bleeding off the bottom edge.
Full-width analytics card with four KPI tiles, a CSS bar chart of the last 30 days, and a top-workflows leaderboard with share bars.
Developer-facing split: copy on the left, tabbed code blocks on the right showing the API request, response, and webhook payload for a workflow.
Hero with a full canvas on the right showing a real workflow flow: trigger node, condition node, and two action branches connected with lines.
Onboarding card with a progress bar and a six-step checklist. Each step shows a completion state, a title, and a short hint.
Three pricing tiers tuned to workflow products: run quotas, workflow counts, and integration limits with a featured plan highlighted.
Tab navigation showing workflow stages with split image cards featuring stats overlays and descriptions. Perfect for demonstrating product workflow or development process stages.
Three-column stats strip where each metric is anchored by a real workflow piece: active runs, success rate, and approvals.
Full-bleed auto-scrolling marquee of studio projects with a header and view-all CTA.
Bento-style grid of work perks with featured image card and icon cards. Mixed layout showcasing PTO, wellness, equipment, and team events.
Three-column categorized preferences with checkmarks and X icons showing preferred vs non-preferred work styles. Perfect for freelancers clarifying ideal project types and engagement models.
Four-column numbered workflow section showing project phases like Discovery, Strategy, Design, and Deliver. Perfect for freelancers and agencies explaining their project methodology.
Interactive workshop selector with capacity tracking, attendee info form, and pricing summary. Perfect for paid workshops and training session signups.
Workshop cards with instructor profiles, skill levels, requirements, and live capacity tracking. Perfect for hands-on conference workshops and training sessions.
A settings panel with a section rail on the left and the chosen group on the right, laying out hairline preference rows with switches, a select for the group's default, and a save bar underneath.
Combined onboarding card for creating a workspace with name and URL slug, plus a team invite section with email inputs. Perfect for SaaS apps that require team collaboration setup.
Full-height workspace picker listing organizations with logo initials, member details, and a create-workspace row, plus a signed-in-as footer. Perfect for multi-tenant apps after sign-in.
Global news grid with color-coded region indicators, hot story badges, and source attribution.
Full-bleed monochrome closing CTA with a giant scrolling marquee behind a single centered seal button.
Releases grouped by year in collapsible accordion panels with release count indicators.
Alternating left-right content blocks building up to a final call-to-action. Perfect for narrative-driven conversion with progressive value reveal.
Centered header above three zigzag rows, each pairing a 4:3 image with a title, description, and tag chips on alternating sides.
Alternating rows of images and stats that swap sides. Each row pairs a photo with key metrics and descriptions.
Four-step zigzag flow that alternates a workflow piece between sides. Each row pairs a numbered step with the live asset it produces.
Justified rows of frames that grow to fill every line, opening a viewer whose picture doubles as the zoom control: clicking switches between fitting the screen and filling it, with the caption and controls on one closing rule.
A pinned scroll hero for a design hotel built on the zoom-parallax component: seven photographs sit in an asymmetric editorial collage under a centered headline, and as the page scrolls every photograph grows at its own pace while the center one glides forward to fill the whole frame and the others fly outward past the edges. Once the bay fills the screen, the semibold headline, an intro, an Arrow Pill and an underline link settle in at the lower left over a soft shade. The collage drifts gently with the cursor, and every collage setting passes through the collage prop. Reduced motion shows the full photograph with all copy.