beste-ui

Book review with cover image, publication details, rating, and pros/cons. Perfect for literary reviews and reading recommendations.

Detailed book review with author bio, ratings, and purchase links. Perfect for literary reviews and book recommendations.

3-column grid with border dividers between items, layout adapts to content. Great for core features grid, capabilities overview, or service sections.

Vertically stacked bordered sections with alternating content and a final call-to-action. Perfect for storytelling-driven conversion.

Bottom-aligned fullscreen hero with inset background media and right-side quick link cards

Fullscreen bottom-aligned hero with vertical stack cards and inset background video with gradient overlay

Contained 16:9 hero carousel with badge, title, description, and CTA over an image background. Auto-rotates with centered, clickable dots at the bottom — same carousel engine as hero19 but not full-height.

Contained 16:9 hero carousel with badge, title, description, and CTA. Vertically centered content that anchors to the left, center, or right via the contentAlign prop. Auto-rotates with centered, clickable dots.

A workflow that states one trigger on an inverted full-width panel, then forks into two equally weighted condition branches whose outcomes sit in nested cards carrying the share of cases they account for.

A contact section that asks a branching set of questions instead of one long form: a rail lists the steps that currently apply and lets you jump between them, and answering the first question adds or removes the steps below it.

A four-column footer with a wide brand column carrying a parenthetical eyebrow, an oversized wordmark, a two-line tagline and labelled social links, beside three ruled link columns with an inline mail address and a centered copyright bar.

Centered eyebrow, heading, and description above a grid of borderless brand cards — each with a square, colorable logo plate, a title and short description, and a full-width animated seal detail button.

Two-row navbar with main navigation and secondary breadcrumb bar for hierarchical content paths. Perfect for e-commerce product pages and documentation with deep category structures.

Animated breaking news ticker with live indicator, category badges, and auto-rotating headlines.

Schedule cards for coffee breaks, lunch, and social events with timing, locations, and activity highlights. Perfect for showing networking opportunities.

Centered hero section with heading, CTA buttons, and a realistic browser chrome mockup displaying product screenshots. Perfect for SaaS landing pages showcasing web app interfaces.

Split layout with stacked stats on the left and a browser window mockup displaying a screenshot on the right.

Centered hero with perspective browser mockup, floating notification cards at corners, and star rating badge. Perfect for SaaS products and web apps.

Questions as clickable pills with answers expanding below. Bubble-shaped buttons for interactive selection.

Budget-based plan selector with slider control that highlights the best matching plan. Perfect for helping users find the right tier.

Customizable pricing with base plan and selectable add-ons that update total dynamically. Perfect for modular products with optional features.

A newsroom bulletin with a square eyebrow, an image-free lead story split across a 7/5 grid with a standfirst, byline, and a seal button, then three illustrated columns with hover-zoom images below a single hairline rule.

Bundle breakdown with chunk list showing size, gzip, and module counts. Large chunk warnings, percentage bars, and change indicators for tracking growth.

JavaScript bundle analysis with chunk breakdown. Visual size bars, module lists, and gzip comparisons. Color-coded by type: app code, vendor, assets.

A hero that sets its position and paragraph against a seal button held at the right edge of the same row, then runs a captioned wide photograph beneath it and closes on one portrait card per writer.

A narrow signup where the reader first picks how often they want to hear from you, the paragraph underneath rewriting itself for the choice, before the single email row is filled in.

Event calendar sync with multiple export options including Google Calendar, email invite, and ICS download. Perfect for event reminders and schedule syncing.

Split-layout hero with weekly calendar mockup showing events, attendees, and floating reminder notification. Perfect for scheduling and calendar apps.

Speaker submission CTA with submission deadline, benefits checklist, and proposal guidelines. Perfect for conferences seeking talk proposals.

Release feed with prominent callout blocks highlighting the most impactful change per release.

Booking cancellation screen with the original booking summary, cancellation reason picker (radio list with optional notes), live refund breakdown based on cancellation policy, confirmation checkbox, and destructive cancel action.

Two-column guide with preparation tips and company commitments to candidates. Sets expectations for the hiring process with contact info.

Ruled, expandable capability rows with oversized type, detail copy, and monospace tag chips.

Asymmetric bento of capabilities: an image hero cell, accent cell and icon cells.

Looping carousel of capability cards with a centered media slot per card. Each slot accepts an image, video, or live registry-component asset.

Two-column split with an eyebrow, big heading, description, and CTA on the left and a checklist of capabilities with rounded check seals on the right.

Full-bleed monochrome hero with a giant display heading, short description, and a continuous bottom marquee of capability chips that pauses on hover.

An interactive feature where a hairline list of four capabilities swaps the image tile beside it, each one floating a different live asset with its own supporting paragraph.

Article wrapped in a bordered card container with featured image at top and tags integrated into header. Works well for curated collections or featured stories.

Single card that rotates through questions with progress dots and navigation buttons. Great for featured question rotation.

Three-column responsive grid of blog cards featuring author avatars, tag badges, and hover zoom effects. Clean card design with date and read time metadata.

Stat cards that start stacked on top of each other and fan out into a grid on scroll using framer-motion spring physics and staggered delays.

Question-answer cards with external link buttons below. Drives users to related resources or docs.

Career progression path with level indicators, role descriptions, and key skills. Shows growth framework from junior to principal level.

Vertical timeline showcasing career milestones with achievement icons, year badges, descriptions, and key metrics. Perfect for professionals displaying awards, launches, and growth achievements.

Centered careers intro with eyebrow, highlighted heading and supporting copy above a three-image gallery — one wide frame beside two portraits.

A hiring coming-soon section with a centered square eyebrow and heading, a working job-alert email form, and a list of upcoming roles with team and employment type.

A clinical overview with an eyebrow over a hairline rule, a two-column heading, and a bordered dashboard panel that composes a journeys stat, a retention ring, and a slim live-status strip, closing with a big-number outcomes row.