Production-ready UI blocks for landing pages, dashboards, and web apps.
Security section pairing four ruled pillars with circular icons and a labelled row of measured figures such as uptime and support response, closed by a caveat note beside an outline pill CTA.
A compliance section pairing four hairline certification cards, each with an accent icon and a tone-coded status pill, with a hairline definition list of data handling specifics and a security pack request.
Icon badges for shipping, returns, security, and support in default, compact, or detailed variants. Perfect for building trust near checkout buttons.
E-commerce trust signals with large icons and supporting stats for security, returns, shipping, and support guarantees.
A centered pre-launch section with a monospace parenthetical eyebrow, a statement heading, a supporting paragraph, a waitlist pill button, and a captioned grayscale logo strip of early partners.
Trust hero with a heading, description and CTA beside a tall portrait image, over a grayscale logo marquee.
Social proof section with star rating breakdown, recommendation percentage, and company highlights like awards and traveler counts. Perfect for building credibility on travel booking pages.
A centred install hero whose serif headline ends in a word that keeps changing (a pricing page, a hero, a footer), so the promise reads as a list of things the agent can be asked for. Below it an ink command pill that copies the install command on click sits beside a sliding-marker outline pill, then a quiet note.
A centred serif headline that settles in word by word, then an ink panel that cycles through short request and reply pairs: the request in serif, the reply in mono a beat later, with thin progress bars to jump between them and a pause on hover. A pill that copies the install command on click and a sliding-marker pill close the section.
A hero whose serif headline always breaks over two lines, the second one a word that takes turns, each blurring in as the last blurs out over a line kept at a fixed height, beside an intro and a sliding-marker pill, above three photographs that drift at their own pace as the page scrolls, the middle one set a step lower.
Multi-part tutorial series with numbered parts. Book icon, part count, and progress-style list. Perfect for step-by-step learning content.
Centered headline, four feature tiles in a 2x2 grid, and a CTA. Each tile leads with a large Lucide icon and a short description.
Two case studies side by side under a serif heading that settles in word by word: each with a photograph drifting inside its frame, a small-caps client and sector line, a serif title, a summary, and a ruled foot pairing a serif result figure with a read link.
An FAQ split across two columns of independent accordions, so opening one answer never closes another, closing on a soft support panel with two actions.
Alternating two-column feature cards with large icons over background media, left-right zigzag layout
An always-open FAQ laid out as a two-column grid of numbered, hairline-separated question and answer entries, closing with a soft support panel that pairs a short prompt with two actions.
Minimal two-column layout with fixed-width date column on the left and version heading with change list on the right.
FAQ accordion split into two independent columns.
Article with two-column intro section separating key points before main content begins. Perfect for explainers that need dual perspectives.
Questions on left, answers on right in a two-column grid layout. Works well for balanced, side-by-side presentation.
A tabbed comparison under a centred serif heading that settles in word by word: pill tabs switch between approaches, each blurring in a drifting portrait photograph beside a serif title, a description, a ruled fact list and a sliding-marker pill.
Two large contrasting plan panels (light vs dark) for engagement models.
Centered heading with description, followed by two images side-by-side. Configurable image ratio (equal, left larger, right larger). Always horizontal on mobile.
Two ruled directories side by side under their own small-caps headings, every row a link carrying a serif label, a line of context and an arrow that lifts as the row tints on hover.
Two tall cards, each one a whole link: a photograph that drifts inside its frame above a quiet label, a serif title, an intro, a short dotted list and a closing arrow link pinned to the foot of the card.
A closing call to action offering two routes as side-by-side cards, each with an icon tile, a short kicker, a checked list on hairlines, and its own action, with the recommended route outlined in the accent.
Closing section that offers two routes side by side, each a ruled column with a title, a short pitch, a dotted-rule list of what to expect and its own pill CTA, one solid and one outline.
A call to action that offers two doors: under a serif heading that settles in word by word, two soft muted cards each with a serif title, a description and a sliding-marker pill, the first topped by a photograph that drifts inside its frame as the page scrolls.
Side-by-side comparison of different viewpoints on a topic, with color-coded columns and author info.
Side-by-side comparison table with check/cross icons and text values for two plan tiers. Perfect for free vs premium comparisons and feature tier breakdowns.
A two-plan pricing section: a sticky column with a serif heading that settles in word by word, an intro and a reduced-fee note, beside two cards, one soft muted and one ink, each with a serif price, a check list and a sliding-marker pill.
A tall photograph that blurs in and drifts on scroll on the left; on the right a serif headline that settles in word by word, an intro, a monthly or yearly pill switch, and two plans as ruled rows, each with a serif price that blurs to its new value, the included features in one line and a sliding-marker pill.
Two picture-led routes side by side, each with an eyebrow, title, dotted-rule expectations list and its own pill CTA, separated on desktop by a small pill divider sitting between the columns.
A messaging section splitting a hairline matrix between the staff view and the member view, each half floating its own live asset above a title and a list of what that side gets.
A centred install hero that explains itself in two numbered steps under a ruled line: run the command, copied from a rounded pill on click, then ask for a page, shown as an example prompt in a muted mono panel. Serif headline settles in word by word, one sliding-marker pill below.
A hero with a serif headline settling in word by word, an intro and a sliding-marker pill on the left, and two offset portrait photographs on the right that drift at different speeds as the page scrolls, one sitting a step lower than the other.
Stacked two-tier call-to-action with primary offer on top and secondary alternative below, separated by a divider. Perfect for presenting main and fallback conversion paths.
Cards with colored header section and white content area. Clear visual separation with color blocking.
A feature built from two tall bordered cards, each stacking an image tile with a live asset over a small kicker, an editorial title, a checked list on hairlines, and its own outline action.
Browser-chrome card pairing two minimal code panes — TypeScript type definitions on the left, real call-site usage on the right. Monochrome syntax with muted comments. Every label is editable; no media props required.
A pinned scroll hero for an expedition company. A giant heavy word is cut out of the page surface as a window onto a full-bleed mountain photo, with a quiet eyebrow above it. As the visitor scrolls, the camera flies into the first letter on an exponential zoom, the photo drifting closer more slowly for depth, until the landscape fills the frame; then the heading, intro, an Arrow Pill and an underline link settle in over a soft scrim at the lower left. Built on the type-window component; reduced motion shows the open photo with the copy.
Terminal-style interface with typing effect for answers. Animated typing creates dynamic reveal effect.
Monochrome 404 built on oversized display type: a parenthetical eyebrow, a display headline with a muted emphasis clause, a pill call to action, and a ruled index of every section on the site.
Centered typographic hero on a muted card with an oversized heading, inline CTA, and a bottom monospace meta row of three labels.
Oversized type project index where each row reveals a thumbnail and shifts to the accent on hover.
Oversized number rows with labels and context, editorial style.
A monumental full-bleed image pre-launch statement with a dark overlay, a monospace parenthetical eyebrow, an oversized centered wordmark, a single supporting tagline, and a light outline notify pill button.
Bento mosaic mixing product screenshots with text and accent tiles.