Industries/ Professional services
Marketing agency website components for React
Agency buyers ask who you have worked with, what happened and how to start. The studio hero with an availability CTA, a logo cloud with outcomes on hover, a process section and transparent retainers answer all three.
One command for the whole set
npx shadcn@latest add @facade/hero-agency @facade/logo-cloud @facade/features-bento @facade/process-steps @facade/stats-band @facade/team-grid @facade/testimonials-wall @facade/pricing-section @facade/cta-section @facade/footer-big3 of these 10 blocks are Pro and install with a license key; the other 7 are free and MIT licensed. The @facade registry is set up once in components.json. Setup guide.
The page, block by block.
Every preview is the real block running at desktop width. Click a name to open its docs, props and source.
- Hero, agencyFree
- Logo cloudFree
- Process stepsFree
- Stats bandFree
- Team gridFree
- CTA sectionFree
Two ways to open the page.
Example hero copy for marketing agencies. Each one answers the question the visitor actually has.
Headline
Who have you worked with, and what happened?
Why it works
A logo cloud with hover reveal of client outcomes, and a stats band for the aggregate.
Headline
How do we start?
Why it works
Process steps from audit to roadmap to sprint, and an availability CTA in the hero.
Blocks on this page
- Hero, agencyFreeStudio hero with oversized centered display type, one ultramarine CTA and a quiet client wordmark marquee.
- Logo cloudFreeTrusted by wordmark grid with hover reveal of client outcomes and an optional two row marquee mode.
- Features bentoProSix cell bento grid with live micro animations: review counter, map pins, inbox stack, chart, toggle, booking.
- Process stepsFreeHow it works section with a line that draws on scroll and steps that light up as you pass them.
- Stats bandFreeBand of four big animated numbers with labels, trends and hairlines that draw in on view.
- Team gridFreeTeam members grid with gradient initials avatars, bio reveal on hover, social links and a hiring card.
- Testimonials wallProMasonry wall of Google and Yelp style reviews with a featured quote and aggregate rating header.
- Pricing sectionProThree tier pricing with an animated monthly or yearly toggle, a dark featured plan and feature lists.
- CTA sectionFreeClosing CTA panel with headline, two actions and a reassurance line. Dark on light pages, light on dark.
- Footer, bigFreeLarge local business footer with animated newsletter, link columns, NAP, hours, socials and a giant wordmark.
Questions about marketing agency sites
Something else? Email hello@facadeui.com.
Can the agency hero show availability?
Yes. The availability prop renders a line such as Two slots open in Q1 with a pulsing dot, next to the primary CTA. Change it from a CMS field when you fill a slot.
How do I show client outcomes without a case study page?
The logo cloud reveals a line per logo on hover, for example doubled demo requests in 6 months. Keep the line factual and link the logo to the case study when you have one.
Should an agency show prices?
Retainers and productized services fit the pricing section with a monthly and yearly toggle. For custom work, use the tiers as starting points and say so in the comparison note.
What does the features bento hold for an agency?
Six services: SEO, paid media, content, design, development, analytics. Each cell has a micro animation; the chart and counter cells fit agency services well.
Related industries
- Law firm10 blocks: agency hero, stats band, features bento
- Accountant10 blocks: agency hero, logo cloud, features bento
- Brokerage10 blocks: real estate hero, listing filters, property listing grid
Read the marketing agency template, section by section or see all industries.