Industries/ Real estate
Brokerage website components for React
A brokerage site is a search tool with a team behind it. The hero search panel, full listing filters and a sortable grid handle the inventory; the agent grid with languages and ratings answers who to call.
One command for the whole set
npx shadcn@latest add @facade/hero-real-estate @facade/listing-filters @facade/property-listing-grid @facade/stats-band @facade/team-grid @facade/logo-cloud @facade/testimonials-wall @facade/valuation-funnel @facade/cta-section @facade/footer-big4 of these 10 blocks are Pro and install with a license key; the other 6 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.
Two ways to open the page.
Example hero copy for real estate brokerages. Each one answers the question the visitor actually has.
Headline
Show me homes in my budget.
Why it works
Buy, Rent, Sell hero search plus full filters with a dual price slider and a sortable grid.
Headline
Which agent should I call?
Why it works
A team grid of agents with languages, specialties and ratings in the bio reveal.
Blocks on this page
- Hero, real estateProBright brokerage hero with a crisp house render, Buy, Rent, Sell search panel and animated proof numbers.
- Listing filtersFreeHome search filters with location search, type chips, beds and baths, dual price slider and result count.
- Property listing gridProFilterable, sortable listings grid with animated re-layout, saved homes and load more pagination.
- 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.
- Logo cloudFreeTrusted by wordmark grid with hover reveal of client outcomes and an optional two row marquee mode.
- Testimonials wallProMasonry wall of Google and Yelp style reviews with a featured quote and aggregate rating header.
- Home valuation funnelProMulti-step "What's my home worth?" lead funnel with direction-aware steps and an animated estimate range.
- 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 brokerage sites
Something else? Email hello@facadeui.com.
How do the listing filters and the grid work together?
The filters emit an onChange with location, type, beds, baths and price range. Pass that state to the grid as the listings subset, or refetch on the server. The grid animates the re-layout.
Can the hero search send visitors to a results page?
Yes. The onSearch callback receives the mode, location, type and price range. Build the results URL from it and navigate.
What belongs in the logo cloud for a brokerage?
Portals you syndicate to, press mentions and partner lenders. The hover reveal can show the outcome, for example 1,200 listings syndicated.
Is the valuation funnel useful for a brokerage?
Yes. It is the seller lead capture for every agent in the office. Route the lead by ZIP in the onLead callback.
Related industries
- Real estate agent10 blocks: real estate hero, agent card, property listing grid
- Property developer10 blocks: real estate hero, new development showcase, availability table
- Accountant10 blocks: agency hero, logo cloud, features bento
Read the brokerage template, section by section or see all industries.