HTML Services Section Templates

Dark section with four service cards: icon, deliverable chips, typical timeline and a hover glow. Intro and CTA sit on one row above.

Large numbered rows with tags; on desktop a preview image follows the cursor over each row, on phones it shows inline. Light editorial style.

A local plumbing and heating service list with fixed call-out prices, a 24/7 emergency panel with response time and phone number, and trust badges.

A spa treatments carousel: filter chips (all, massage, facials, body), scroll-snap cards with therapist portrait, duration and price, and prev/next arrows.

A long services section with a sticky index on the left that highlights the service in view (scroll-spy), and detailed service blocks on the right.

A three-question service finder: big option cards, progress bar, back button and a result card that recommends a service with a booking link.

Vertical service tabs on the left; each panel shows what is included, a headline result from a case study, a client quote and a link. Keyboard-accessible tabs.

A home cleaning service picker: clean type cards, bedroom and bathroom steppers, frequency discount and add-ons, with a live price summary that stays in view.

Health clinic service cards, each with an illustrated specialist, price, the next free slot and a book button; insurance note and a link to all services above.

A gardening company coverage section: clickable map regions and region buttons that show response time and the services offered there, plus a postcode check.

An architecture studio services row: four tall panels with floor-plan art; the active one expands to show the description and a link. Works with hover, click and keyboard.

A solicitor practice-areas section: serif headline, six areas with icons and fixed-fee badges, a featured lawyer for each area that changes on hover or focus, and a free-consultation call to action.

A garage service menu where you pick your vehicle size (illustrated) and every price updates, with a reg-plate lookup, add-to-booking buttons and a running booking bar.

A friendly pet groomer section: three grooming packages with illustrated dogs, a dog-size switch that adjusts prices, tick-box extras and a total with a booking button.

A managed IT provider section: six cards that flip on hover, focus or tap to reveal what is included, plus a response-time strip with live helpdesk status.

A tutoring service section: subject chips and a level filter narrow a grid of tutor cards with illustrated portraits, rating, price per hour and a free trial lesson button.

A wedding photographer section: pick a package and a wedding-day timeline highlights exactly which moments are covered, with deliverables and price beside it.

A handyman service section driven by search: type the problem in your own words and matching jobs appear with trade, starting price and time, plus popular jobs and a photo-quote option.

A translation agency section: choose language pair, document type and word count, pick standard, express or certified, and see the price and the real delivery date (working days only).

A coworking space services bento: membership types, meeting rooms with a live availability badge, a café card, a floor-plan illustration with hot desks, and an events strip.

A removals company section: count your rooms with steppers and an illustrated van fills up and recommends the right vehicle, crew size and starting price.

A solar installer section: roof orientation picker, monthly bill slider and battery toggle drive the system size, panel count drawn on a roof, yearly savings bars and payback time.

A driving school section: choose manual or automatic, pick an instructor card with pass rate and availability, then a lesson package that updates the price and per-hour saving.

A mobile car valeting section: three package tabs light up hotspots on an illustrated car showing what is included, with duration, price and a postcode check.

A tailor's alterations menu: garment tabs with an illustrated garment, dotted-leader price rows, a standard/express toggle that recalculates prices and the ready-by date.

A recruitment agency section with a sector grid showing live job counts, a sector search, a split candidate/employer switch that changes copy and CTAs, and a CV upload drop zone.

A personal trainer section with a big coach portrait, format cards (1-to-1, online, duo, group) and a sessions-per-week stepper that updates the monthly price, plus a goal checklist.

An online print shop section: product tabs with a true-to-shape paper preview, paper finish choice and a quantity tier table where bigger runs show the per-unit saving.

An interior designer's services as a horizontal step journey: illustrated room stages, fee and timing for each step, arrows to move, and a pick-the-steps you need estimate.

A laundry and dry-cleaning service: bag-size plans, a pickup day strip with morning and evening slots, a return promise, and a summary that turns into a weekly subscription with savings.