22 / Landing pages

Landing-page primitives

Fourteen reusable marketing-landing surfaces for the Oak Flats Mufflermen brand — hero splits, hero centred kinetic, social proof, feature grids, carousels, pricing tables, comparison matrices, FAQ accordions, lead-capture forms, metric strips, case studies, CTA bands, event cards, and partner logo grids. Bonus: a full landing composition.

Production answer

Landing-page primitives is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.

Primary CTAReview Landing-page primitives states
Generative search brief

Landing-page primitives: Fourteen reusable marketing-landing surfaces for the Oak Flats Mufflermen brand — hero splits, hero centred kinetic, social proof, feature grids, carousels, pricing tables, comparison matrices, FAQ accordions, lead-capture forms, metric strips, case studies, CTA bands, event cards, and partner logo grids. Bonus: a full landing composition.

Composable marketing-landing surfaces — drop-in for public-site pages
Primitive 01

Hero split section

Split-screen hero — copy + dual CTA on one side, framed media tile on the other. Mediaside reversible.

HeroOpen
Primitive 02

Hero centred section

Centred hero with KineticText headline, badge, background grid, dual CTA, and trust pillars.

HeroOpen
Primitive 03

Social proof strip

Heading + rating + review count + customer-since line, with a row of partner logo cards.

TrustOpen
Primitive 04

Feature grid section

3 × 2 feature grid — icon + headline + body + optional inline link per tile.

FeaturesOpen
Primitive 05

Testimonial carousel

Carousel of testimonial cards — avatar initials, star rating, quote, case-study link, dot indicators.

Social proofOpen
Primitive 06

Pricing table card

3-column pricing table — feature checks, recommended badge on the middle tier, single CTA each.

ConversionOpen
Primitive 07

Comparison table section

Vs-competitor comparison matrix with check / partial / X states and a highlighted self column.

ConversionOpen
Primitive 08

FAQ accordion section

Single-open accordion with a live search filter — narrows entries by question, answer, and tag.

SupportOpen
Primitive 09

Lead capture form

Three-step progressive form — contact, vehicle, service — with stepper + explicit success panel.

CaptureOpen
Primitive 10

Metric counter strip

Row of in-view animated counters — years in business, vehicles serviced, five-star reviews, fleet vehicles.

MetricsOpen
Primitive 11

Case study card

Case-study card — problem / solution / results blocks with outcomes list and PDF download CTA.

StorytellingOpen
Primitive 12

CTA band section

Full-width CTA band with layered background, kicker, headline, sub-text, and dual button row.

ConversionOpen
Primitive 13

Event card

Upcoming event card — date tile, headline, location, summary, capacity bar, RSVP button.

EngagementOpen
Primitive 14

Partner logo grid

Partner / supplier logo grid with category line, caption, and an external-link icon per card.

TrustOpen
Bonus

Full landing composition

Every landing primitive sequenced into one full Mufflermen marketing landing surface.

CompositionOpen