Haul
Haul is a free, two-page Bootstrap 5 website template built specifically for moving companies and removalists. It pairs a full one-page homepage — instant-quote hero, services grid, live cost estimator, pricing, stats, crew, testimonials, service areas, and FAQ — with a dedicated services page that details every service and includes a full booking form. Every interaction is hand-written vanilla JavaScript with no jQuery or plugins, and the whole template is progressively enhanced so content stays visible with JavaScript disabled.
Key features
- Instant-quote hero mini-form (from/to ZIP, move date, home size)
- Working move-cost estimator with live itemized price range
- Six niche service cards: local, long-distance, packing, storage, office, specialty
- Detailed services page with per-service checklists and CTAs
- Validated quote and booking forms in plain vanilla JavaScript
- Count-up trust stats and a keyboard-accessible testimonials slider
- Transparent pricing tiers plus a 'what affects your cost' breakdown
- Native details/summary FAQ with single-open accordion behavior
- Inline SVG icons, sticky navbar, and a working mobile menu — no jQuery
Best for
- Moving companies and removalists
- Local relocation and man-with-a-van services
- Storage and packing service providers
- Commercial and office moving firms
- Any local home-service business needing a quote-first site
At a glance
- Two pages:
index.html(full one-page site) +services.html(services + estimator + booking) - Bootstrap 5, self-hosted — no jQuery, no plugin dependencies
- Deep navy + energetic orange identity; Archivo + Mulish type pairing
- Working cost estimator and validated quote/booking forms, all vanilla JS
- Accessible: semantic landmarks, ARIA on custom widgets, visible focus, keyboard support
- Progressive enhancement: content fully visible with JavaScript disabled
- Responsive and mobile-first with a working collapsible mobile menu
- Free for personal and commercial use
How to use it
Download the ZIP, unzip it, and open index.html — no build step, nothing to install. Edit the text and images, point any forms at your backend or a form service, and deploy the folder to any static host. Colours and fonts live in css/style.css; the interactions are in js/main.js.
Frequently asked questions
Is Haul free to use for a commercial moving business?
Yes. Haul is free for both personal and commercial projects under the standard uiCookies license, so you can use it for a real moving company website. The one requirement is attribution, and the exact terms are on the uiCookies license page. There is no paid tier — the download is the complete two-page template.
Does the cost estimator actually calculate real prices?
Yes. The estimator is fully working vanilla JavaScript: it combines your selected home size, distance band, and any extras (packing, storage, piano, stairs, supplies, full-value protection) into a live, itemized estimate range that updates instantly as you click. The numbers are sensible placeholder figures modeled on typical moving costs, and they're all defined in one object at the top of js/main.js so you can swap in your own rates in minutes.
Do the quote and booking forms send emails on their own?
No — Haul is a static front-end template, so the forms are fully marked up and validated in the browser but have no backend attached. To make them live, point each form's action at a form-handling service or your own server-side script. The client-side validation, error states, and success messages are all already built, so you only need to wire up delivery.
Will the site still work if a visitor has JavaScript disabled?
Yes, and that's deliberate. Haul uses progressive enhancement: every scroll animation's hidden start state is scoped under a .js class that's only added when JavaScript runs, so with JS off all content renders at full opacity. The estimator, forms, services, and FAQ all show their content by default, and the FAQ uses native HTML details/summary that works without any script at all.
Does Haul use jQuery or any plugins?
No. The template is completely jQuery-free with zero plugin dependencies. The mobile menu, sticky navbar, scrollspy, cost estimator, form validation, count-up stats, testimonials slider, and single-open FAQ are all hand-written vanilla JavaScript, organized one function per feature with guard clauses. Icons are inline SVG, so there's no icon-font dependency to load either.
How do I change the colors, fonts, and phone number?
The whole palette lives in CSS custom properties at the top of css/style.css — change the navy and orange values there and they cascade across both pages. Fonts are the Archivo and Mulish Google Fonts pairing loaded in each page's head. Company details like the phone number, address, hours, USDOT number, and service areas are plain text in the HTML, so you edit them directly with no build step required.
Is Haul responsive and accessible?
Yes. It's built mobile-first on the Bootstrap 5 grid and adapts from large desktops down to phones, with a working collapsible mobile menu. For accessibility it uses semantic landmarks, alt text on every image, ARIA roles on custom widgets like the slider and estimator, visible focus styles, and full keyboard support. It also honors the prefers-reduced-motion setting, disabling animations and autoplay for visitors who ask for it.
What's included in the download and what should I replace before launch?
You get both HTML pages (index.html and services.html), the custom css/style.css design layer, vanilla js/main.js, and self-hosted copies of Bootstrap 5's CSS and JS bundle. Demo photos are referenced from the img/ folder as local paths — swap them for your own optimized images, and update the placeholder company name, phone number, reviews, and pricing to match your business before going live.
