Free React Tradie & Trades Components

Homeowners hiring a tradie are asking three quiet questions: will you show up, will the price be fair, and can I trust you in my house. These twelve components answer them directly, a who-shows-up section with real faces, a credentials bar with licence numbers, a workmanship guarantee, a rate card and payment plans that kill quote anxiety, a job timeline and how-a-job-runs walkthrough, a before/after slider, brands-we-service strip, service area map, an emergency bar for after-hours work, and a quote banner that makes the ask easy.

12 components · MIT licensed · installable with the shadcn CLI

Before / After Slider

Job-proof comparison, drag or arrow-key the divider between before and after panels, with honest labels and a job summary line. Built for bathroom renos, not screenshots.

Brands We Service

A brands-we-service wall for React, text-only brand chips grouped by appliance, parts-stocked tags, and a call fallback. Tailwind tokens, zero logo assets.

Credentials Bar

The trust strip that closes trade jobs, license number, insurance, years on the tools, and review score in one sturdy row. Mono where it's data, bold where it's pride.

Emergency Bar

A 24/7 emergency strip, a lamp that pulses once, the phone number set huge for wet thumbs, and an average-callout stat that counts up. Urgency without panic, dependable at 2am.

How a Job Runs

The job pipeline set plain, quote, schedule, work, walkthrough, with big numerals, a one-line promise per step, and response-time chips. No jargon, no mystery, no surprises on the invoice.

Job Timeline

Renovation job timeline React block, week-by-week phases on a vertical spine with mono date windows and heads-up disruption notes. Tailwind, plain-spoken.

Payment Plans

Payment plan explainer React block for trades, weekly amounts in mono, a worked job example ledger, and honest fine print. Tailwind tokens, no BNPL branding.

Quote Banner

A get-a-quote block built the way tradies win work, phone number first and huge, a response-time promise, and a three-line job form. No friction, no fluff.

Rate Card

A tradesman rate card for React, call-out fee, hourly and after-hours rates as an honest mono ledger with plain-English fine print. Tailwind tokens throughout.

Service Area Strip

Where-we-work as a confident strip, radius statement, suburb chips grouped by zone, and a same-day badge for the home patch. Local SEO structure built in.

Who Shows Up

A crew strip that answers the homeowner's real question, who is coming to my house. First names, years on the tools, and the van ID in mono so the ute in the driveway matches the website.

Workmanship Guarantee

The guarantee set large and plain, one promise sentence in display type, terms in honest small print at a readable size, and the license and insurer line in mono. A handshake, not a legal wall.