Blocks

Centered Hero

Full-screen centered hero with an announcement badge and two calls to action.

Split Hero

Two-column hero pairing a bold headline with a product visual.

Render Hero

Bold claim on a solid backdrop, with a wide 3D render pinned to the bottom corner.

Photo Hero

Full-bleed photo hero with an eyebrow, a large headline and two actions over the image.

Product Hero

Centered headline over a product screenshot set on a grid of color bands.

Abstract Hero

Inset full-screen hero on an abstract photo, with an oversized headline and actions below.

Bento Features

Bento grid of feature cards with illustrations and supporting copy.

Accordion Features

Feature list that reveals details in an accordion next to a preview image.

Panel Features

Three full-height colored panels with line-art marks, numbers and a short pitch.

Illustrated Feature Grid

Six tinted tiles linking to each feature, each with a small illustration and a scribble.

Product Tiles

Tall light and dark product tiles with offers and photos that bleed off the edge.

Product Preview Cards

Tinted cards with a centered serif title over a glimpse of the product, wide when stacked.

Principle Cards

A headline with a call to action over three cards, the first set in reverse.

Value Cards

Three plain cards, each a short title at the top and its reason at the bottom.

Image Accordion

Large accordion headings, each opening its own image beside the list.

Integration Cards

Three tall colored cards, each framing one workflow above its name and pitch.

Timed Feature Tabs

A row of tabs that play through on their own, each opening a headline beside a photo.

Spotlight Tabs

A wide photo with a floating status card that changes with each tab below it.

Product Card

A split card pairing a short pitch with a cropped product screen and a toast.

Diagram Tabs

Steps on the left drive a diagram that draws forward or rewinds to the chosen step.

Sticky Section Nav

Long feature sections with a sticky side nav whose dot follows your scroll.

Stacking Cards

Tinted feature cards that stack on top of each other as you scroll.

Scroll Accordion

Numbered features that open one by one as their images scroll into view.

Three-Tier Pricing

Classic three-plan pricing table with feature checklists.

Highlighted Pricing

Pricing table that spotlights a recommended plan with a badge.

Spotlight Pricing

Tall plan cards with grouped features, and a glowing badge on the popular plan.

Plan Overview

Three softly tinted plan cards that say who each plan is for.

Pricing with Comparison

Four plans with a monthly and annual switch, followed by a full comparison table.

Centered CTA

Centered call to action with a headline, supporting text and buttons.

Image CTA

Call to action set over a full-bleed image with a gradient overlay.

Landscape CTA

Centered headline and two actions above a green hill that rises from the page.

Painting CTA

Dark card with an email signup beside a classic painting that fills the frame.

Night City CTA

Navy split card with a bold headline and app rating beside a city tower.

Sky CTA

Centered headline and two actions on a dawn sky framed by soft clouds.

Accordion FAQ

Single-column frequently asked questions in an accordion.

Split FAQ

FAQ with a heading column beside the accordion.

Testimonial Grid

Grid of customer quotes with avatars and social handles.

Testimonial Wall

Wall of testimonials with a section header and call to action.

Testimonial Carousel

Self-playing carousel of member stories with photos, outcomes and a progress bar.

Customer Stories

Carousel of customer story cards with brand art, a one-line summary and a link.

Testimonial Tabs

One centered quote at a time, picked from a row of company tabs.

Brand Testimonials

A quote card that takes on each customer's brand color and moves to the next on a timer.

Centered Newsletter

Large headline with an inline email signup and a link to past issues.

Photo Newsletter

Photo beside a newsletter form that asks for an email, name and company.

Panel Newsletter

Newsletter signup centered in a soft rounded panel.

Link Footer

Multi-column footer with grouped links and a copyright bar.

Brand Footer

Footer with a brand statement, link columns and social icons.

Contact Footer

Link columns with a blog list, contact details, social links and a status line.

Newsletter Footer

Footer with a newsletter signup, a studio address and contact links.

Landscape Footer

Link columns and a status line above a painted landscape that fades into the page.

Navbar

Responsive navbar with a navigation menu and a mobile sheet.

Floating Navbar

Rounded floating navbar with a navigation menu and a mobile sheet.

Mega Menu Navbar

Sticky navbar with full-width mega menu panels and a full-screen mobile menu.

Drawer Navbar

Store navigation in a side drawer that drills into categories, with a back button at every level.

Fullscreen Menu Navbar

Navbar that opens a full-screen menu with large links, featured work and contact details.

Login Form

Login card with social sign-in, an email form and validation.

Sign-up Form

Sign-up card with social sign-in, an email form and validation.

Stats

Key metrics section with large figures and short descriptions.

Logo Marquee

Infinitely scrolling cloud of customer logos.

Sticky Timeline

Milestones along a vertical line, beside a sticky intro with actions.

Multi-step Inquiry Form

A four step project inquiry in a card, with segmented progress and choice cards.

Multi-step Registration

A dark three step registration with icon inputs, choice cards and a step counter.

How It Works

Three numbered steps with an action each and a small product preview below.

Contact Panel Form

A three step request with a stepper, a review step and a contact panel beside it.

Alternating Timeline

Milestones that alternate sides of a center line, each with a framed photo.

Autoplay Timeline

One year at a time beside a stack of photos, with a progress indicator and pause.

Step Rail

Numbered steps along a rail that fills as you scroll, each with detail cards and a preview.

Accordion Timeline

A stack of milestones that opens one at a time as you scroll, each with a photo.