Production-ready UI blocks for landing pages, dashboards, and web apps.
Minimal navbar with configurable animated underline effects (slide, grow, or fade) on navigation links. Perfect for portfolio sites and creative agencies wanting subtle hover animations.
A centered pre-launch section with a square eyebrow, a heading, a supporting line, a row of accent statistics that count up when scrolled into view, and a dark seal claim-seat button.
A feature that centers one image tile floating a live metrics panel and annotates it from both sides with four icon callouts that collapse under the tile on smaller screens.
A central core image framed by feature cards that each reference how a module connects back to the system's core.
Browser-framed product screenshot with surrounding feature callouts.
A navbar with a dark announcement strip above a hairline-bordered row carrying a lowercase wordmark, uppercase links, a sign-in link, an accent call to action, and a mobile menu.
Centered single card with badge, heading, description, and highlight pill. Great for announcements, feature release highlights, or promotional callouts.
Navbar with a dark scrolling announcement bar on top — looping links that pause on hover and fade at the edges — over a clean wordmark row with a pill CTA.
A sticky navbar topped by a thin ink announcement bar with a small-caps link, then a frosted bar with the serif wordmark, uppercase links that underline from the left on hover, a sliding-marker pill, and a light full-height mobile menu whose links settle in one after another.
A single announcement laid out like an article, with a standfirst, a full-bleed captioned photo band, a reading column, and a sticky rail carrying the key facts and related entries.
An annual results section pairing an image tile that floats a live breakdown chart with a light interpretation of it, then four hairline readings that each name their own source, closing on a method panel.
Annual pricing tiers showing per-month equivalent cost and yearly savings. Perfect for encouraging annual commitments with clear value display.
A help section that asks two questions instead of offering a search box: the answers pick one written answer from a list of routes, an image tile beside them floats the answer as a live assistant card and changes with it, and a soft panel underneath keeps a way through to a person.
A lens maker's pinned scroll hero over the aperture-reveal component. The section opens on a closed camera iris set in a turned metal ring, with the eyebrow and a large heading above it and a pinpoint of light at the center. Scrolling turns the brushed metal blades open, then the ring grows past the frame until a night sky photograph fills the screen, and the heading, a short description, an Arrow Pill and an underline link settle at the lower left over a soft scrim. The text moves between clean states instead of fading with the scroll, the light on the metal follows the cursor, and reduced motion shows the open photograph with the text in place. Every iris setting passes through the aperture prop.
Interactive REST API endpoint reference with method badges, expandable parameter details, and response types. Grouped by resource.
A developer section that lists common endpoints as hairline rows pairing tone-coded method chips with monospace paths, beside a dark code panel holding a full sample request and its response.
Browser-chrome card pairing a DevTools-style API inspector on the left with a syntax-highlighted code editor on the right — method badge, response body, timing footer. Every label is editable; no media props required.
API key management panel with masked credentials, reveal/copy controls, scope badges, and active/revoked status indicators.
Technical reference with endpoint cards, HTTP method badges, and side-by-side request/response examples. Perfect for API documentation.
API documentation cards showing response examples with color-coded status badges. Headers section, JSON body with copy button, success/error variants.
API pricing table showing tiered rate per request with volume discount breakdown. Perfect for developer APIs and infrastructure services.
API analytics dashboard with endpoint usage table. Stats cards for requests, latency, error rate, and active users. Trend indicators and method badges.
Terminal-style structured log viewer with level filtering. Color-coded INFO, WARN, ERROR, and DEBUG entries with timestamps and source labels.
Three intake questions that land on a real appointment type instead of a drop-down: the answers pick a route with its length, its facts, and the clinician you will sit with, and the image tile beside them swaps its floated availability card to match.
Upcoming and past appointments list grouped by date, with service name, provider avatar, time, duration, status badges (confirmed/pending/cancelled), and reschedule/cancel action buttons.
An approval workflow drawn as a vertical rail of nodes tinted by whether each step is done, waiting, or queued, naming the person and the timestamp, beside a tile floating the live request card.
Mobile app promotion footer with phone mockup screenshot, feature highlights, download stats, app store badges, and QR code. Perfect for mobile app marketing pages.
An app pre-launch split card with a muted panel holding a wordmark, a monospace parenthetical eyebrow, a heading, a working email waitlist form and platform chips, beside a full-bleed image covering the other half.
A warm paper hospitality hero built around one tall arched window: inside it, the horizon-gradient background component paints a dusk sky with a low sun on a hazy horizon, a shimmering trail and drifting cloud streaks, rising softly on load. The headline sits to the left of the arch and the intro, a dark Arrow Pill and an underline link to the right, anchored to the bottom; on small screens they stack around it. Every sky setting passes through the sky prop.
One column per year on a hairline, each stating the year as a figure with its published count beside it, a sentence on what that year was about, and the pieces that defined it.
Text-first archive index of reference, thumbnail, title and year, opening a record card with two sides: the work on the front and the registrar's acquisition, condition and storage notes on the back.
Technical article with code blocks featuring language labels, filenames, and copy-to-clipboard buttons. Ideal for programming tutorials.
Article with full comment system, replies, likes, and featured comments. Perfect for community-driven discussions.
Three-column layout with table of contents on left, main article in center, and right sidebar for related content. Perfect for long-form guides.
Two-column layout with main article and right sidebar containing related article cards with thumbnails. Perfect for discovery-focused content.
Two-column layout with main content on left and sticky author profile card on right with social links. Great for individual contributor articles.
A full article layout with a ruled byline row, a wide lead image, prose blocks that carry their own anchors, an accent-ruled pull quote, a closing tag row, and a contents rail that sticks beside the text on desktop.
Three-column layout with TOC left sidebar, main article center, and action buttons with tags right sidebar. Best for technical documentation.
Exhibition split into artist rooms, each with a sticky statement column beside its works, opening a viewer that shows the chosen piece large with the next one waiting as a thumbnail you can step straight into.
A developer tool hero over the ascii-render component: a rotating lattice form and drifting noise are raymarched into a low-res cell buffer, then printed with a monospace glyph ramp in the theme's foreground with primary highlights, and cells light up around the cursor. A headline, an intro, an Arrow Pill and an underline link sit on the quiet side. Every scene setting passes through the ascii prop; colors follow the theme, it pauses offscreen, shows a still frame for reduced motion and falls back to a dot grid without WebGL.
An open question FAQ pairing a soft panel that sticks while you scroll, holding a working question and email form, with the questions others sent recently answered as linked hairline entries.
A header with a serif headline that settles in word by word and a pill that copies the install command on click, then a rounded pill tab list (pages, sections, components). Each tab pairs a title, a paragraph and a short list of example prompts in mono with a photo that blurs in and drifts on scroll.
An assistant section where question pills swap the image tile beneath them, each floating a live answer card that cites the records it read, closing on three hairline guarantees and one action.
One oversized lead figure paired with a ruled, right-aligned stack of supporting stats split by a vertical rule.
40/60 asymmetric split hero with narrow content panel and vertical quick links over video
Alternating rows with tall highlight card and stacked compact cards over background media
A full-height photographic hero: the image drifts at a slower pace than the page behind a film-grain overlay, and a serif headline settles in word by word ahead of the intro, a soft pill button and an avatar trust line.
Onboarding screen with a quick survey asking how the user discovered the product, with selectable options and an optional text input. Perfect for marketing attribution during signup.