@blockus

Centered hero with a soft conic-gradient aurora behind the headline and a row of stacked avatars as social proof.

The full blockus opening — sticky non-auth header on top, crosshair-framed dotted backdrop, an announcement pill, a four-clause balanced headline and dual CTAs…

Two-column hero with copy on the left and a mock terminal showing the install command on the right.

Centered headline whose bracketed word rotates between five options via a pure-CSS keyframe.

Serif headline, kicker ribbon and a two-column intro evoking a magazine cover layout.

Dark split hero with a tilted dashboard mockup on the right, conic glow behind the copy and a customer-logos row anchoring the bottom.

Centered serif headline, glowing primary CTA and a logo marquee at the bottom — moody and high-contrast.

Left-aligned hero with a diagonal violet light beam slicing across the canvas and a Used-by trust strip at the bottom.

Hero combining a strong headline with a four-stat metric grid revealing growth numbers under the CTA.

Hero with an interactive spotlight that follows the cursor, revealing a hidden gradient under a dotted backdrop.

Hero copy on the left paired with a four-tile bento grid teasing the product's key capabilities on the right.

Centered hero with an auto-scrolling badge marquee under the headline highlighting capabilities and integrations.

Single bold offer card with monthly-vs-lifetime savings callout and decorative gradient bloom.

Free, Pro and Team tiers side-by-side with feature checklists and a highlighted middle plan.

Two-plan layout with a billing-period switch and a discount badge on the yearly option.

Three compact tiers arranged in a single horizontal card — perfect for a marketing site footer band.

Single plan whose total updates as the user slides the team-seat count between 1 and 25.

Three dark service-tier cards with coloured category chips, scarcity badge and gradient bottom CTAs.

Full feature-by-tier comparison matrix with grouped sections, sticky header column and tier callouts.

A single big-statement pricing card with a vertical price stack, glowing accent and a long feature list.

Tiers arranged vertically as expandable rows revealing per-plan features on click.

Usage slider with tiered breakpoints — live preview of the estimated bill based on monthly volume.

Single offer card with a custom-amount input, three preset chips and a live confirmation strip.

Three-tier pricing with a currency switcher (USD / EUR / GBP) that updates every plan in place.

Two-plan layout with the annual plan visually amplified — savings badge, comparison bar and copy callout.

Base plan card with stacked add-on checkboxes; total recomputes as add-ons are toggled.

Pricing card on one side, rotating customer quote on the other — social proof anchored to the buy decision.

Free and Pro plans in two clean side-by-side cards, one highlighted — monthly-only, no toggle required.

One product, one price — a centered card with a full feature list, compare-at strikethrough, and trust badges.

Three tiers with a monthly/yearly toggle and a save-20% badge, middle tier highlighted as most picked.

Rows of features across three plans with check/dash indicators, built as a responsive grid with grouped categories.

Native range slider updates an estimated monthly price in real time as the user drags through event-volume tiers.

Four minimal plan tiles in a single row — price, three bullets each, and a CTA, nothing more.

Two pricing cards on the left, a small FAQ accordion on the right — answers sit next to the buy button.

Always-dark stone-950 canvas, single featured tier with a violet radial glow and a glowing CTA button.

Two-panel layout — a priced Pro tier on the left and an Enterprise contact-sales panel on the right.

Seat stepper with +/− buttons and quick-pick presets updates the monthly and yearly totals in place.

One-time lifetime deal with a compare-at strikethrough price, savings badge, and trust-badge row.

Left column carries a punchy serif brand statement, right column groups three nav lists.

Compact nav columns on top, a huge wordmark across the bottom serving as a visual anchor.

Final-call footer leading with a Ready-to-ship CTA card and a slim copyright row underneath.

Full-width newsletter capture as the centerpiece, framed by nav columns and a copyright row.

Single rounded dark card containing brand, nav and copyright — sits inside the page like an island.

Dark rounded CTA capsule floating above a light footer with a faded oversized wordmark behind it.

Footer leading with a grid of integration partner logos, paired with concise nav columns.

Footer combining a live status pill, newsletter capture and a social-icon row in a single band.

Minimal single-row footer — brand on the left, condensed nav and socials on the right.

Footer with three location blocks (city, address, hours) and a thin contact band on top.

Sticky bottom CTA bar over a slim footer — drives final conversion as the user reaches the page bottom.

Footer with a four-tile mini product showcase grid above the navigation columns.

Footer set on a rich gradient with a large brand statement and tightly-spaced nav lists.

Three mini testimonial cards form a rail above the standard footer columns.

Massive single-line brand wordmark dominates the layout, with a discreet nav band on top.

Centered hero with inline metric chips, paired with a live, clickable dashboard mockup — sidebar pages, tab switcher and chart toggle all wired up.

Massive sans-serif headline on a cream canvas with playful pebble decoration, a hover-revealed product mega menu and a multi-logo trust strip below.

Pure-black hero with a status callout on the right and a fully clickable issue-tracker mockup — sidebar pages, tabs and prev/next navigation all interactive.

Sky-blue editorial hero with serif headline, paper-cut mountain horizon and a notebook app mockup — plus a hover-revealed product mega menu in the floating nav…

Centered headline with a clean three-field contact form — the safest starting point for any marketing site.

Two-column layout pairing a copy block plus email / phone / locations on the left with a long form on the right.

Routes visitors to the right team via three side-by-side cards — Sales, Support, Press — each with its own CTA.

Split card with a dotted-grid HQ panel on the left and a full contact form on the right.

Long form on the left, four contact-method tiles on the right — email, phone, live chat, response time.

Three office cards showing city, address, hours and a deep link to Maps — perfect for an About / Contact page.

Dark hero-style contact section with a glowing radial backdrop and a glass form card floating on top.

Single-column contact card — email, message, send — plus a row of social icons under a hairline divider.

Form on the right, four gradient-avatar teammates on the left signalling Sales / Support / Partnerships / Engineering.

Half newsletter capture, half contact form in a single rounded card — for sites that want both.

Pick Sales / Support / Press first — the form below adapts its placeholder and CTA to that route.

Three-step form with progress dots — You, Project, Goal — for warm inbound leads.

Minimalist contact form floating inside a frosted card over a soft tri-gradient backdrop.

Form on the right, sticky aside on the left listing reasons-to-write and the support email.

Minimal centered hero with a single rounded email pill — the lightest contact section in the catalog.

Centered headline plus an accordion of common questions — the bread-and-butter FAQ layout.

Sticky copy on the left, full accordion on the right — easier scanning when there are 5+ questions.

Pill tabs route between General / Billing / Support, each backed by its own accordion list.

Six question-and-answer cards in a tight grid — quick to scan when no question dominates.

Editorial-style FAQ with mono numerals on the left and questions in big tracking-tight type.

Search input above the accordion — typing filters the list live, with an empty-state nudge to email support.

Single big-typography question on top with a long answer card below and a row of related-question pills.

FAQs grouped into two themed cards side-by-side — Product on one, Billing & team on the other.

Accordion on the left, sticky support card on the right with a CTA to open a ticket.

Inverted FAQ block — moody dark background, pink glow and a frosted accordion shell.

Mixed-span FAQ tiles arranged like a bento board for a more editorial feel.

Sticky topic sidebar paired with stacked themed sections — perfect for a docs-style FAQ page.

Question and answer in two columns per row — fastest to read when answers are short.

Two-column FAQ with a sticky support-CTA card on the right — keeps the help button always visible.

Quiet, serif-typeset FAQ with a section glyph header — fits brand sites that favour print restraint.

Classic shadcn-style centered login card — brand mark, email, password, primary CTA and a sign-up nudge.

Single email field, magic-link CTA and an outline Continue-with-Google fallback below.

Form on the left, full-bleed marketing testimonial panel on the right — the proven SaaS layout.

Headline-led magic-link login with a pill-shaped email + button input — minimal and intentional.

Three social-provider buttons up top with a Continue-with-email form below the divider.

Email first, password second — the Notion / Linear pattern with a back-button and remembered email.

Single card with a Sign-in / Create-account toggle so a visitor never bounces because they need the other flow.

Login card with a remember-me checkbox and a Terms/Privacy disclaimer baked into the form footer.

Six individual digit inputs with auto-advance focus — the 2FA confirmation screen ready to drop in.

Pure-black login card with a terminal-pill header and a mono-styled sign-in button — designed for dev tools.

Full-width black brand panel on the left with the marketing statement, login form on the right.

Centered login card with a row of integration wordmarks underneath as social proof.

Frosted login card floating over a soft violet / pink radial gradient backdrop.

Login form anchored inside an architectural crosshair frame — a quiet brand-forward auth screen.

Login card with a clear forgot-password link plus a dashed call-out routing visitors to start a free trial.

Sister to login-01 — centered card with full name, email, password and a primary Create-account CTA.

Headline-led signup with a single pill-shaped email + button — for ungated lead capture.

Three-step sign-up — You, Team, Plan — with a progress bar and plan radio cards on the final step.

Continue-with-Google / GitHub buttons up top and a Continue-with-email form below the divider.

Trial-focused signup card with reassurance pills — Free for 14 days, no card required.

Marketing testimonial panel on the left, sign-up form on the right — the SaaS classic.

Feature tiles on the left, sign-up form on the right — communicates value while collecting the email.

Centered card with an icon, social-proof headline and a single email-plus-button input.

Full sign-up card with first / last name, terms checkbox and a marketing-emails opt-in.

Compact sign-up card with a row of customer wordmarks beneath as social proof.

Sign-up form on the left, a mini dashboard mock-up on the right showing what they unlock.

Pure-black sign-up card with frosted inputs — pairs with login-10 for dev-facing products.

Inverted brand panel on the left with the marketing pitch, sign-up form on the right.

Frosted sign-up card hovering over a teal / pink radial gradient — pairs with login-13.

Picked plan summary on the left, account form on the right — connects pricing CTA to checkout.

Six-logo strip under a one-line trust headline — the safe default trust row for any landing page.

Eight wordmarks arranged in a hairline-divided grid — feels like a tidy customer wall.

Infinite-scrolling marquee of customer wordmarks with edge fades — set-and-forget social proof.

Each logo card carries a tiny meta-label (Case study, Hackathon, Customer) for an honest trust row.

Massive headline with a hard customer count, anchored by a row of six wordmarks below.

Three case-study cards — each pairing a logo with a single numeric outcome and a short caption.

Two side-by-side cards combining a customer logo with a serif-set quote and an attributed author.

Four-cell stat grid above a logo strip — quantitative trust plus visual trust on one band.

Wordmarks wrapped in rounded pill chips so they read as a brand tag cloud instead of a row.

Twelve-logo grid where each card lifts and crystallises on hover — interactive trust strip.

Two opposing marquees — top scrolls left, bottom scrolls right — for richer movement in the trust band.

Inverted logo wall with a subtle indigo glow — pairs naturally with dark landing pages.

Centered cloud with a live-deployment pill on top and a soft sky glow behind the headline.

Logos grouped by category — Developer tools / Productivity / AI — each in its own labeled row.

Big featured-customer card with a quiet row of the rest underneath — useful when one brand carries the proof.

Logo + flat nav links with an active-state chip + Login / Get-started CTAs — the bread-and-butter site header.

Three-column grid header — logo left, centered nav, CTAs on the right with a ghost Login and primary button.

Top utility band with a live status dot, a dismissible New badge and a changelog link, plus two NavigationMenu dropdowns on the nav row — Product categories an…

Product + Solutions triggers open a full NavigationMenu — feature grid for Product, two-column Use cases / Content for Solutions.

Logo, Product + Solutions NavigationMenu dropdowns, flat links and the Sign-in pill — everything tucked into one rounded backdrop-blurred pill.

Sticky top bar that swaps to a translucent blur once the page scrolls past 8px, with a NavigationMenu Pricing dropdown comparing the three tiers inline.

Logo on the left, centered rounded pill with two NavigationMenu dropdowns (Product + Solutions) and ghost Sign-in plus a glowing indigo Start-for-free CTA on t…

Search-styled ⌘K trigger height-matched with the Sign-in button, plus a Developers NavigationMenu listing CLI, registry tokens, MCP and GitHub Action.

Inverted dark header with a glowing indigo Start-free button and ghost Sign-in — pairs with dark heroes.

Top thin row carries email, phone and a locale switcher; main row carries the brand + nav + CTAs.

Logo + active-aware app nav + an avatar pill that pops a profile / settings / billing / sign-out menu.

Slim utility row on top (by-line + secondary links), main brand + nav + CTA row below.

Frosted header card with a soft violet-to-pink corner gradient and two NavigationMenu dropdowns — outcome-led Use cases and audience-led Industries.

Header with a live shipped-version pill that pings, linking to the changelog — broadcasts product velocity.

Centered hero with a hand-drawn underline accent, capability pill row and a tilted blue gradient frame holding a full CRM appointments mockup at the bottom.

Centered hero with a live status pill, three-line headline, dual CTAs, partner wordmark row and a clean dashboard mockup with metric tiles, weekly revenue char…

Two-column hero pairing a serif-feel headline with a sculpted 3D pentagonal blob on the right and a Used-by logo row anchoring the bottom.

Pure-dark hero with copy on top and two side-by-side wallet cards — total balance with sparkline plus an accounts list — anchored by a live-updates caption.

Dark hero with diagonal violet light beams slicing across the canvas, an emerald Get-Started CTA in the nav and a Loved-by world's best logo row.

Centered three-column path with numbered icons, kicker, headline and a single Get-started CTA.

Four-step vertical timeline with dashed rail, numbered nodes and an icon per step.

Three product-flow steps — Capture, Verify, Settle — each card paired with a faithful mini UI mock (payment form, risk checks, receipt).

Sticky headline on the left, scrolling numbered cards on the right — each with a board / code / funnel mock to make the step concrete.

Compact four-step row connected by dashed arrows — fastest at-a-glance pipeline diagram for an above-the-fold band.

Four steps arranged as a mixed-span bento — catalog tiles, terminal pane, theme swatch row and a metric summary CTA.

Pure-dark how-it-works with three terminal panes — one per step — showing real CLI output and a glowing primary CTA.

Serif-typeset how-we-work with roman-numeral chapters, kickers and an artifact card per step — perfect for studio sites.

Centered headline above a hairline-divided three-stat row — the safe default metric band.

Four metric tiles with kicker, value and one-line context each — works on every neutral page.

Three stats over a dotted world-map backdrop with a live status pill — feels like a global trust band.

Sticky headline on the left, vertically-stacked metrics with color accent bars on the right.

Four-tile bento mixing large sparkline cards with compact delta tiles — uptime, growth and snapshot metrics in one.

Two big metric tiles next to a dark testimonial card — quantitative and social proof on a single band.

Three large metric cards, each topped with its own sparkline and quarter-by-quarter rail.

Serif-typeset stats — each row pairs an oversized numeric with a narrative paragraph.

One serif quote, five stars and an avatar — the bread-and-butter testimonial band.

Three quote cards in a clean grid, each with a star rating, body and gradient avatar.

Single big editorial quote card with a brand wordmark header and a serif-cut opening glyph.

Two-column testimonial — a light card next to a dark inverted card for visual contrast.

Single big quote with prev / next arrows and a dot nav — cycles through four customer quotes.

Mixed-span bento of customer quotes — large brand-logo cards next to compact text cards.

Two case-study cards pairing a brand logo, a numeric outcome metric and a quote with a Read-case-study link.

Crosshair-framed band with 4.9 / 5 headline, a Read-more-customer-stories CTA and a logo strip.

The actual blockus marketing header — sticky border-b row with logo, flat nav and Sign-in / Get-the-catalog pill CTAs. Mobile drawer pushes the nav into 3xl ta…

Authenticated variant of the marketing header — Pricing drops out of the nav, the right-side CTAs are replaced by an avatar pill that opens a tier-aware Accoun…

Dark-canvas variation of the blockus opening — same sticky non-auth header and crosshair-framed dotted backdrop, inverted to stone-950 with a live-shipping pil…

Editorial serif variation of the blockus opening — serif wordmark, 4.9 / 5 customer-rating pill, hand-set headline and a logo strip of teams reading along unde…

Stripped-back centered contact form with name, email, and message — no distractions, just the essentials.

Two-column layout with a contact form on the left and contact details plus a styled map placeholder on the right.

Contact form with a segmented department picker (Sales / Support / Billing) that updates the placeholder and hint copy.

Three-column card grid routing visitors to Sales, Support, and Press — each with an icon, blurb, and direct email CTA.

Booking-style contact section where visitors pick a reason and a preferred time slot via chip selectors before submitting.

Always-dark stone-950 section with a large editorial headline on the left and a compact inline form on the right.

Full contact form paired with a side column listing office cities, addresses, and opening hours.

Minimal centered FAQ with a clean accordion and inline email CTA — no frills, just answers.

Eight Q&A pairs in a hairline-bordered two-column grid — scannable without any interactive overhead.

Sticky left panel with headline and contact CTA card anchors while the accordion scrolls independently on the right.

Four topic tabs switch which Q&A set renders — keeps long lists scannable without a search input.

Rounded search input narrows a ten-item accordion in real time, with a graceful empty state and question counter.

Always-dark stone-950 canvas with outsized mono question numbers — high contrast, typographically driven.

Standard FAQ accordion capped with an avatar cluster support card and a contact CTA.

Centered logo, single horizontal nav row, social icon buttons, and a copyright line — the cleanest possible footer.

Brand mark and tagline anchored left, a compact vertical nav list on the right — sparse and intentional.

Newsletter signup band at the top, four nav columns below, and a legal bar with language select and social icons.

A full-bleed radial-gradient 'blockus' wordmark sits behind three compact nav columns, creating depth without imagery.

A high-contrast 'Start building today' CTA band flows directly into the footer below, sharing the same background plane.

Animated green status pill, a language selector, and social icon row — compact and production-aware.

Three full nav columns beside a brand panel with App Store and Google Play download badges and social links.

Oversized serif wordmark as the editorial anchor, full four-column sitemap, pill-style social row, and fine-print bar.

An embedded two-column layout with a compact contact mini-form on the left and office location cards on the right.

Zero-decoration, whitespace-first hero with a small eyebrow label, a single oversized tracking-tight headline, one subline, and a pill CTA — the clean baseline.

Left-aligned copy with a right-side bento grid of three interactive app panels: a live dashboard, an activity feed, and a team roster.

Centered copy on a soft multi-radial gradient background, paired with a glassy outlined CTA + solid CTA, and a floating analytics product card below the fold.

Centered hero with an inline email-capture form beneath the headline, confirmed state on submit, and a stacked avatar row with a live-count social proof label.

Left copy with trust badges and a right column of three depth-stacked notification cards that overlap to suggest a live activity feed.

Centered headline and CTAs above a browser-framed video thumbnail card with a play-button overlay that toggles a playing state on click.

Centered phone-frame device mock with a live-looking app screen, flanked by iOS App Store and Google Play download badge buttons.

Clean centered card with Google and Apple social buttons above a standard email/password form.

Two-column layout with a logo-trust panel and rotating customer quote on the left, minimal form on the right.

Six individual digit boxes with auto-advance, paste support, and keyboard navigation for OTP verification.

Four stacked provider buttons (Google, Apple, GitHub, Microsoft) with an or-email divider and a single email field below.

Always-dark stone-950 canvas with a radial indigo glow behind the card and a frosted-glass form panel.

Side-by-side layout pairing a testimonial panel with a login form that includes a remember-me checkbox and forgot-password link.

Email field submits a magic-link request and transitions to a confirmation state showing where the link was sent.

Minimal centered card with name, email, password, and a sign-in link — the cleanest path to account creation.

Two-column layout pairing a feature checklist and testimonial on the left with a full sign-up form on the right.

Three-step wizard — account credentials, profile details, and a confirmation screen — with an animated progress stepper.

Live four-segment strength bar and per-rule checklist that update as the user types, with the submit button disabled until the bar hits Fair.

Two-column layout showing a Pro plan summary card with pricing and benefits beside the account creation form.

Always-dark stone-950 canvas with Google, GitHub, and Microsoft provider buttons above a traditional email/password fallback.

Owner credentials at the top, plus a dynamic list of teammate email inputs (up to 9) that can be added or removed inline.

Single-row grayscale logo strip with a small uppercase kicker — the leanest trust signal you can drop into any page.

12-logo grid with hairline dividers forming a bento-like structure — each cell highlights on hover.

Two rows of logos scrolling in opposite directions via pure CSS keyframes — no JS required.

Oversized trust stat (4,000+ teams) flanked by supporting metrics, with a logo strip anchored below a divider.

Logos organized into labeled columns by vertical (Fintech, Dev tools, AI & data, Media) inside a bordered bento grid.

Logo left, nav center, ghost sign-in and solid pill CTA right — mobile nav opens in a Sheet slide-out.

NavigationMenu with a 3-column product grid and a compact resources dropdown, mobile-friendly sheet fallback.

Centered rounded-full nav bar with backdrop blur and a collapsing dropdown panel below it on mobile.

A collapsible top banner for release announcements sits above the main nav and persists in the mobile sheet when dismissed.

Compact contact + social utility bar above a full main nav row — standard for enterprise and e-commerce sites.

A search trigger pill that opens a command-palette style Dialog with quick links and recent searches on ⌘K.

Always-dark stone-950 canvas with a violet-to-sky gradient underline that animates in on active and hover states.

Two-row retail header: logo + search + account/cart icons on top, category nav strip below — cart count badge included.

Minimal 3-step section with numbered circles, a full-width connector line and a centered CTA — no icons, type does the work.

4-step vertical checklist with lucide icons in bordered circles, a thin spine connector and generous left-aligned prose.

4-step left/right alternating layout anchored by a vertical spine with primary-coloured connector dots and bordered cards.

Click-driven 4-step stepper with a sticky preview panel that swaps its content per active step — built with useState.

Tabs primitive drives a 3-phase layout where each tab reveals step prose alongside a contextual mock UI panel.

4-step bento layout with mixed-size tiles, oversized watermark numerals and one accent tile — no icons needed.

5-stage horizontal pipeline with arrow connectors, equal-weight cards and a gradient progress bar beneath the flow.

Always-dark bg-stone-950 canvas with three columns, oversized faded step numbers as background texture and clean prose.

4-step vertical timeline on a left border spine; each step carries a terminal-styled code card showing the exact command.

Two-column before/after split with bullet lists, X/checkmark icons and a centred arrow divider — clear contrast CTA below.

Four big numbers in a 2×2 / 4-column bordered grid, centered text, no headline clutter.

Three metrics under a kicker headline and subtitle, arranged in a clean centered flex row.

Four bordered cards each leading with a lucide icon, a large number, and a one-line body.

Headline and copy on the left; a vertical list of metrics with up/down trend pills on the right.