@7ovr

A hero section with a headline, subheadline, and primary call-to-action.

A centered sign-in card with email, password, and social login.

A feature grid highlighting product capabilities with icons.

An analytics dashboard with stat cards and a bar chart.

An application shell with a sidebar, top bar, and content area.

A full-width site header with logo, navigation links, a call-to-action, and a mobile menu sheet.

A site footer with link columns, a brand blurb, and social links.

A centered call-to-action band with a heading and buttons.

An integrations grid of connectable services with icons.

A logo cloud of companies that trust the product.

A frequently-asked-questions accordion section.

A contact section with contact details and a message form.

A pricing section with three tiers and a highlighted plan.

A testimonials section with customer quote cards.

A stats band highlighting key product metrics.

An application layout with a navigable left sidebar.

A settings page with grouped preference rows and toggles.

A data table with a toolbar, status cells, and pagination.

A bento grid of mixed-size tiles, each with an icon, title, and short description.

A three-step 'how it works' row with numbered, iconed steps.

A centered newsletter signup with an email field and subscribe button.

A dismissible top announcement bar with a message and an inline link.

A three-card blog post grid with cover, title, excerpt, and author.

A team grid of member cards with avatar, name, role, and socials.

A three-column plan comparison table with check and cross marks.

A responsive image gallery grid of evenly sized tiles.

An inbox-zero empty state for an empty notifications list, with an icon, title, description, and an action.

A current-plan billing summary card with price, renewal, and usage.

An AI assistant chat thread built on the Message, Bubble, and MessageScroller components, with user and assistant bubbles, avatars, timestamps, auto-follow scr…

A welcome onboarding card with a step indicator and a checklist.

A command palette card with search and grouped command rows.

A notifications panel with read/unread rows and timestamps.

A three-column kanban board with task cards.

A month calendar grid with month navigation, a Today shortcut, selectable days, and a detail panel for the selected day's event.

A file upload card with a drag-and-drop dropzone and an Attachment list that shows each file with a spinner while uploading and a check when done.

An analytics card with a bar chart built on the chart component.

A 2x2 equal-tile bento grid with centered heading, where each tile has a square icon, a badge category label, a title, and a one-line description. All four til…

A vertical left-rail timeline that stacks four numbered steps down the page, each with a bordered icon circle, a connecting line to the next step, a monospaced…

A full-width horizontal band on a bg-muted panel with branding label, heading, and subtext on the left, and an inline email input plus subscribe button with a …

A centered card-style product-update callout featuring a "New" badge with version label, a bold feature headline, a supporting detail sentence, release metadat…

A minimal blog post list showing five articles as divider-separated rows, each with category badge, date, title, excerpt, author avatar with name, and a ghost …

A centered single row of five team members, each showing a large avatar with name and role stacked beneath, under a heading and badge. No cards or bios.

A two-column "Us vs. Them" layout with two side-by-side cards. The Acme card lists check rows of product advantages with a primary CTA, while the Others card l…

A single large browser-framed product screenshot placeholder with a version badge and descriptive caption, plus a five-thumbnail strip beneath it for secondary…

An empty inbox state centered in a solid-bordered card panel, featuring a muted illustration placeholder with a decorative box grid and inbox icon, a title and…

A billing invoices card displaying a table of past invoices with invoice number, date, amount, a status badge, and a per-row download link.

An AI chat that opens on a suggested-prompt empty state, then switches to a Message and Bubble thread on MessageScroller once a prompt is sent, with a multi-li…

A three-card horizontal setup grid where each card presents a numbered onboarding step with an icon, title, short description, and a toggleable action button t…

A command palette panel with a search input, a Recent section showing timestamped file/page rows with hover-reveal arrows, and a Results section of icon-label-…

A compact notifications dropdown panel showing a bell trigger button with an unread badge, a small header with count, four notification rows each with an avata…

A single "In Progress" kanban column rendered as a vertical list of rich task cards, each showing a title, two-line description, priority badge with icon, labe…

A weekly agenda view showing Mon–Sun with time-slotted event rows, color-coded status borders and dots, and prev/today/next navigation.

A compact inline file-upload form field with a bordered row and a "Choose file" label-trigger, plus an Attachment showing the selected file with its name, size…

An analytics card with a gradient-filled area chart showing a monthly active users trend, topped by a three-KPI summary row (total, peak month, peak count) and…

A split two-column hero with headline, subheadline, and two CTAs on the left, and a framed product-screenshot placeholder (stat cards, bar chart, table) on the…

An alternating left/right features layout with three rows, each pairing a copy block (eyebrow, title, body paragraph, and a four-item bullet list) with a decor…

A two-tier pricing layout with a side-by-side split panel: a filled Pro tier on the left and a plain Starter tier on the right, each showing a price, feature c…

A single featured testimonial with a large centered quote, oversized avatar, name and role, and a company logo placeholder. No cards or grid, just a focused sp…

A minimal four-up stat band with oversized numbers and short labels evenly spaced under a single short heading, with no badges, dividers, or secondary copy.

A four-column grid of brand logos, each cell a muted card showing an icon mark and label, beneath a centered heading and subtext, structured for integration sh…

A compact bordered card on a bg-muted panel with a heading, single line of subtext, and one full-width primary button, centered and minimal.

A two-column FAQ layout where each question is a collapsible accordion item, separated by border rules, letting visitors expand answers on demand across two ba…

A dense logo grid showing 18 integration services, each as a compact card with only a service icon and name. No descriptions or call-to-action buttons.

A centered single-card contact form with split first/last name fields, a topic selector, message textarea, and a footer privacy note. No side details column.

A three-column header with logo pinned left, nav links absolutely centred, and a sign-in link plus primary CTA on the right, above a skeleton page-content plac…

A compact single-tier footer with a brand mark and tagline on the left, an inline row of navigation links in the center, and a copyright notice on the right, a…

A two-column split sign-in layout with a branded feature panel on the left and a minimal email + password form on the right. No social login buttons.

A flat single-list sidebar nav (icon + label + optional badge count, one active item) beside a task table content area with priority indicators and status badg…

A compact centered Profile card with an avatar upload section, vertical form fields (name, email, job title), a two-factor authentication Switch, and Discard/S…

A stat-and-activity dashboard featuring four KPI cards with trend badges and a full-width recent-activity feed showing actor avatars, event descriptions, statu…

A static invoices data table showing client avatars, project names, payment methods, due dates, status badges, and right-aligned amounts with a footer total ro…

A sidebar-free app shell with a sticky top bar (logo, search, avatar dropdown) above a tabbed content area featuring project cards, a task checklist, and an ac…

Left-aligned hero with headline, subheadline, two CTAs, and a compact inline stat row showing three key business metrics with icons.

A dense two-column feature checklist with a short left-aligned heading, where each item shows a filled check square, a bold label, and one short description li…

A single-plan spotlight card centered on the page, featuring a large price display, a full feature checklist, a primary CTA, and a social-proof footnote, desig…

Full-width inverted CTA banner on bg-primary with a bold heading, supporting line, and a high-contrast secondary button in a horizontal split layout.

Two-column FAQ layout with a heading, short support CTA card on the left, and a compact single-column accordion on the right.

A compact KPI strip showing six metric tiles in a flush horizontal grid, each with label, large value, and directional delta, beneath a page title and period b…

A two-panel sign-up card with a plan-overview sidebar and a create-account form featuring first/last name, email, password, a terms checkbox, and a sign-in lin…

A static invoice line-items table with a caption showing billed-to details, per-item qty/unit/unit-price/amount columns, and a multi-row footer with subtotal, …

Centered hero over a faint grid and radial glow with eyebrow badge, headline, and inline email capture row

Centered hero with headline, two CTAs, and a trust strip of five inline-SVG wordmark company logos

Infinite auto-scrolling logo marquee with edge fade mask and pause-on-hover for a trusted-by section

Bordered grid of ten muted brand logos that colorize on hover, each with a name tooltip

Centered CTA band with heading, inline email-capture form, and a no-spam privacy note in a muted card

Split CTA with eyebrow, heading, dual buttons, and a framed faux app-screenshot card built from divs

FAQ accordion with a sticky "Still have questions?" contact support card alongside

FAQ with category tabs and a live search input that filters questions across General, Billing and Security

Site footer pairing a newsletter signup with grouped nav columns and a social-icon bottom bar

Mega footer with brand column, four sitemap columns, and a bottom bar with locale switcher and theme toggle

Newsletter signup Card with idle, loading, success, and error states driven by a client state machine

Multi-step newsletter Card with topic toggles and a double opt-in check-your-inbox confirmation

A social-proof newsletter signup centered around a subscriber avatar stack, a star rating and reader count, a headline, an inline email capture with a success …

Dismissible single-line top announcement bar that persists dismissal in localStorage, over a page placeholder

Sticky promo bar with a live ticking sale countdown, fire icon, and shop CTA over a faint page mock

Split-screen sign-in with email/password fields, remember-me switch, social buttons, and a branded value-prop panel

Tabbed auth card that swaps sign-in and sign-up fields, with social login buttons and a divider

A 'no results found' search empty state with an icon, helpful guidance, and a clear-filters action, in a bordered card.

An error empty state for a failed data load, with a destructive accent and retry and contact-support actions.

Searchable integrations directory with category filter pills and a responsive grid of connectable apps

Integration cards grid with per-card Connect/Connected toggle, Switch, badge and live connected count

Features section with category tabs that swap a 3-column grid of icon, title, and description cards

Three-tier pricing section with a monthly/annual segmented toggle and a highlighted most-popular plan

A masonry wall of seven testimonial quote cards in varied heights with avatars, names, and roles

Four-up metric band whose big numbers count up from zero with delta badges when scrolled into view

Contact section with a message form beside a map placeholder and office location cards

Responsive sticky site header with logo, desktop nav, sign-in, a primary CTA, and a useState-toggled mobile menu sheet. Composable into page templates.

Bento grid with a 2x2 hero tile and mixed-size supporting tiles, each with icon, text, and faint div visuals

Interactive horizontal stepper with a progress fill and clickable steps that stacks on mobile

A how-it-works section with three alternating zig-zag rows, each pairing a numbered step with a title, description, and checklist on one side and a mock UI pre…

Blog index with a featured post, category filter pills, and a filterable 3-column grid of post cards

A blog index as a vertical list of horizontal media cards, each with a thumbnail image, category, read time, title, excerpt, and author. A dense archive or art…

Responsive grid of eight team member cards that reveal a bio and social links on hover

Feature comparison table across 3 plans with grouped sections, check/value cells, sticky header and a highlighted column

Masonry image gallery with CSS columns and varied-ratio placeholder tiles that reveal a caption overlay on hover

A featured mosaic gallery with one large hero tile and a grid of smaller tiles, hover zoom affordance, and a lightbox dialog with caption and location for each…

App shell with a collapsible icon-rail sidebar, search top bar, avatar, and dashboard placeholder cards

Collapsible icon-rail sidebar with grouped nav, badges, user footer, and tooltips when collapsed

Tabbed settings page with Account profile fields and switch, Billing plan and payment card, and a Team members table

Notification center card with All/Unread/Mentions tabs, read state toggling, and a mark-all-read action

Billing page with plan summary, usage bar, payment method card, and invoice history table

A usage metering dashboard card with progress bars for seats, storage, API requests, and bandwidth, a near-limit highlight, an estimated total, and a manage-pl…

Live AI chat built on Message, Bubble, MessageScroller, and a shimmering Marker typing indicator, with suggestion chips and a textarea composer.

Multi-step setup wizard card with progress bar, step indicator, per-step fields, toggles, invites and summary

A welcome onboarding empty state with a layered icon illustration, a welcome badge, a headline, a primary create-project action, a take-the-tour action, and qu…

Interactive Cmd+K command palette with fuzzy search, grouped results, arrow-key navigation, and Kbd hints

An inline two-column command palette with a searchable, grouped results list on the left and a live preview pane on the right showing the highlighted item's de…

Interactive month/week calendar with prev/next navigation, view toggle, event chips, and an inline day panel

A drag-and-drop file uploader with an Attachment list that reflects uploading, done, and error states, with validation, toasts, and remove actions.

An image gallery uploader with a responsive thumbnail grid, a cover badge on the first image, per-image remove on hover, an upload tile, and an image count. Fo…

Analytics area chart card with legend, hover tooltip, and a 7d/30d/90d range select that swaps the dataset

A centered 404 page with a heading, message, and home and back actions.

A dismissible bottom cookie-consent bar with accept and decline actions and a policy link.

An application page header with a title, description, and action buttons.

A centered coming-soon page with a waitlist email capture and social links.

A 404 page with a search box and a list of popular pages to recover from.

A 500 error page with retry and contact-support actions and a reference code.

A dismissible bottom-left cookie-consent card with accept, reject, and preferences.

A cookie preferences card with toggle switches for each cookie category.

A centered, blocking cookie-consent dialog over a dimmed page, with an icon, heading, policy link, and accept, reject, and manage actions. A modal consent gate.

An application page header with breadcrumbs, a status badge, and action buttons.

An application page header with a title, description, tabs, and a primary action.

A detail-view page header with a back link, title and status badge, a metadata row showing the owner avatar, created date, and a contributor avatar stack, and …

A split coming-soon page with a waitlist form and a framed product preview.

A coming-soon page with a live countdown timer and an email signup.

A full-bleed coming-soon hero with a subtle gradient and grid backdrop, a brand mark, a launch badge, a headline, a single-line email capture with a success st…

A stats section with metric cards showing values and up or down deltas.

An asymmetric bento grid with one large feature tile and supporting tiles.

A vertical left-rail milestone timeline. Each entry has a bordered icon node connected by a line, a monospaced date, a status badge (Shipped, In Progress, Plan…

A centered, two-sided timeline that alternates entries left and right of a vertical spine on desktop and collapses to a single left rail on mobile. Each entry …

An activity timeline grouped by day, with rows of grayscale avatar, actor, action, and relative timestamp connected by a vertical rail, plus a small status ico…

A version-grouped changelog with a date and version rail on the left and Added, Improved, and Fixed change groups on the right, each with a type badge and a bu…

A tabbed changelog that filters release entries by type (All, Added, Improved, Fixed). Each entry shows a version, date, type badge, title, and description. An…

A compact in-app 'What's New' card with a version pill, release date, and a few highlighted changes, each with a type icon and badge, plus a link to the full c…

A changelog as a vertical timeline with a connected dot rail, each release showing a version badge, date, title, and a list of color-coded added, improved, and…

A three-column product roadmap board grouped by status (Planned, In Progress, Shipped). Cards carry a category badge, title, and description, plus per-status m…

A Now, Next, and Later roadmap with colored phase markers and a target month per phase. In-development items show a progress bar with contributor avatars while…

An interactive public roadmap card where visitors upvote feature requests. Each row has a vote button with a live count, a title, status and category badges, a…

A product roadmap laid out as four quarterly columns, each listing feature cards with a category, a color-coded status icon, and a shipped, in-progress, or pla…

A centered long-form article layout with a category badge, headline, deck, author byline with avatar and read time, a cover image, prose body with headings, a …

A long-form article with a sticky table-of-contents sidebar that highlights the active section as you scroll (scroll-spy). Collapses to a single column on mobi…

A documentation article layout with a breadcrumb, title, last-updated meta, prose body with a code block, and previous/next pagination cards in the footer. A d…

A wide magazine feature layout with a centered headline and deck, a byline row, a full-bleed cover image, and a drop-cap prose body with a pull quote. An edito…

A public profile page with a cover image, overlapping avatar, name and handle, bio, follower stats, a Follow toggle and Message action, and tabs for posts and …

A compact, centered profile card with avatar, name, role, location, a three-column stat strip, and Follow and Message actions. A self-contained profile widget …

An organization profile card with a logo mark, verified company name, description, a stat strip, a member avatar stack, and website and contact links. For comp…

A horizontal progress stepper with numbered nodes, connectors, and labels, showing completed (check), current, and upcoming states. For checkout, onboarding, o…

A vertical stepper with numbered or checked nodes on a connecting rail, each step showing a title and description across completed, current, and upcoming state…

A progress-bar step indicator showing the current step number, a percentage, a progress bar, the active step's title and description, and back and continue con…

A standalone Recent Activity card with avatar rows, each showing the actor, action, target, and relative time. A workspace activity feed for dashboards and pro…

An activity feed grouped by day with Today and Yesterday headers, each listing avatar rows with the actor, action, target, and time. For audit trails and team …

An audit log feed with action-type icon tiles, a two-line event title and detail, a type tag, and a timestamp. For system, security, and audit activity without…

An activity panel with All, Mentions, and Comments tabs, an unread count, and rows showing the actor avatar with a type icon, the action, target, timestamp, an…

A faceted search panel in a bordered card: a search field header, a left sidebar of type filters with counts that interactively narrow the results, and a resul…

A clean search results page with a search field, a result count, and bordered result cards showing title, type badge, snippet, and last-updated date. For site,…

A command-style search panel with a query field and results grouped into Pages, People, and Files, each row with an icon or avatar and meta, plus keyboard hint…

An open-positions list grouping roles by department, each row showing the title, location, and employment type with an Apply call to action. A clean jobs board…

A single job posting detail page with the role title, meta chips for department, location, and type, an About section, responsibilities and requirements lists,…

A careers culture page with a headline intro, a photo strip, a three-up values grid, a perks and benefits row, and a call to action. Sells the team and life at…

A centered about-us intro with an eyebrow badge, a bold mission statement, a supporting paragraph, and a four-metric stats strip for founded year, customers, c…

A two-column story section pairing a grayscale team photo with a company narrative and a three-metric stats row. A founder-story layout for an about page.

A system status overview with an all-systems-operational banner and a list of services, each showing its 90-day uptime and a colored status indicator. A status…

An incident history feed grouping past incidents by date, each with an impact badge and a timeline of color-coded status updates from investigating to resolved.

A 90-day uptime monitor showing per-service daily status bars colored by health, with uptime percentages and a status legend. The classic status-page history v…

A one-to-one chat conversation built on the Message, Bubble, Marker, and MessageScroller components, with a contact header, sender-aligned bubbles, a dated sep…

A two-pane messenger with a selectable conversation list and an active thread built on Message, Bubble, and MessageScroller, each conversation keeping its own …

A live support chat widget built on Message, Bubble, Marker, and MessageScroller, with an agent header, a system marker, quick-reply chips, and a working compo…

A group chat panel with a member avatar stack header, messages from multiple named senders with per-sender avatars, an online indicator, and a message composer…

A responsive grid of review cards, each with a five-star rating row, a quote, and a grayscale avatar with name, role, and company. A social-proof wall with exp…

A full-width inverted stats band on a primary-color panel with a heading and four large metric figures. A high-contrast 'by the numbers' section.

A values and principles grid with a left-aligned heading and a bordered grid of icon, title, and description cards. A static company-values section.

A mission, vision, and values section as three editorial columns, each with an icon, an eyebrow label, a heading, and a short paragraph.

A single-feature spotlight: a two-column layout pairing a headline, copy, and a four-item checklist with a static settings-panel mock built from divs.

A centered hero with a clickable announcement pill, headline, subheadline, dual CTAs, and social proof: an overlapping avatar stack, a five-star row, and a tru…

A static feature-comparison matrix: plans as columns with grouped feature rows, check and dash cells, a highlighted recommended column, and a CTA row.

A named-competitor comparison table with your product highlighted against three rivals, grouped feature rows, and check, cross, or value cells.

An overview dashboard: a four-metric KPI row with deltas above a static recent-orders table with customer avatars, status badges, and amounts.

A single-series line chart card with a grid, axis, and hover tooltip showing monthly visitor trends.

A donut chart card with a centered total and a ranked legend list, breaking down traffic by source.

A centered forgot-password card with an email field that switches to a check-your-inbox confirmation state, plus a back-to-sign-in link.

A set-new-password card with new and confirm fields, live requirement hints (length, uppercase, number, match), and a success state.

A centered sign-up card with name, email, and password fields, a terms checkbox, and Google and GitHub social sign-up buttons.

A search input with an autocomplete dropdown of recent searches and keyboard-navigable suggestions, with an empty state and a slash-to-focus hint.

A four-column project board (To Do, In Progress, Review, Done) with per-column counts and drag-and-drop to reorder cards and move them between columns.

A personal my-tasks board with Today, This Week, and Later lanes of compact task rows that drag-and-drop to reprioritize across lanes.

A 403 access-denied page with a lock icon, an explanation, and back-to-dashboard and request-access actions.

A maintenance-mode page with a tools icon, a friendly message, an estimated return time, and a status-page link.

A 404 page led by an oversized numeral, with a headline, a short message, and go-home and go-back actions.

A list-view page header with a title, a primary action, and a toolbar row of search, status and sort selects, and a list/grid view toggle.

An overview page header with a title, export and settings actions, and an inline four-metric stats strip.

A changelog page with a sticky version-jump sidebar beside long-form release entries grouped into Added, Improved, and Fixed changes.

A blog index with a post list beside a sticky sidebar of search, categories with counts, popular posts, and a tag cloud.

A long-form article with a sticky content sidebar holding an author bio card, related posts, and an inline newsletter signup.

A coming-soon screen with a launch-progress bar and milestone labels above a waitlist email capture with a success state.

A cookie banner with accept and reject actions and a Customize control that expands per-category consent switches inline.

A filterable jobs board with a search field, department filter pills, a live result count, and a list of open roles with location and type.

An app-download call to action with App Store and Google Play buttons and a static QR-code placeholder on a bordered panel.

A site header with a Product navigation menu of links, inline nav, sign-in and CTA buttons, and a mobile sheet menu.

A footer led by a call-to-action band with heading and button, above brand and sitemap columns and a social bottom bar.

An invite-your-team onboarding step with add/remove email rows, a per-invite role select, and skip and send actions.

A dismissible getting-started widget with a progress bar and a checklist of setup steps marked complete or pending.

A payment-methods manager listing saved cards with a default badge, set-default and remove actions, and an add-card dialog.

An add-payment-method form card with name, card number, expiry, CVC, a country select, and a set-as-default switch.

A first-run empty state prompting the user to create their first project, with primary and import actions and a tips row.

A notification-preferences panel with a row per activity type and email and push toggle switches for each.

A stack of dismissible inline notification toasts in success, info, warning, and error variants with an all-caught-up empty state.

A split integrations section pairing a headline, description, and CTA with a bordered grid of integration logos.

A minimal single-row trust strip with a label above a centered row of brand wordmarks that highlight on hover.

A settings layout with a left section nav (Profile, Account, Notifications, Billing) that swaps the active section's cards.

An avatar uploader with a circular preview and change and remove actions, showing the selected image with a format hint.

A complete SaaS marketing homepage assembled from free blocks: hero, social proof, features, stats, testimonials, pricing, FAQ, and a closing CTA.

A lean, conversion-focused landing page for early-stage startups and product waitlists: a centered hero with inline email capture, key stats, an icon feature g…

A logged-in app starter: a collapsible sidebar and a command-palette top bar wrapping a dashboard of stat cards, an interactive area chart, and a sortable, pag…