Insurance Agency Website Template
Demo brand: KEDWORTH & QUIRE · Independent insurance brokers · 15 routes · Astro 7 + Tailwind 4
Live preview
The demo is a full desktop site. Open it in a new tab ↗
About this insurance agency website template
A complete site for an independent insurance broker: fifteen built routes including four cover pages, a claims route, a quote route, a three-post notes section, an about page and privacy.
The whole site is drawn as a certificate of insurance — tobacco brown and paper cream, a counterfoil rail down the right edge, perforation lines cutting the sections. One accent carries the policy number, the CTA and the endorsement stamp. Alegreya against Inconsolata. Texture is the loud channel.
The signature move is that the engraving is the policy. One guilloche engine cuts the hypotrochoid a real rose engine traces, and its gearing comes from the cover: sum insured sets the teeth on the fixed gear at one per £10,000, term sets the rolling gear, excess throws the pen off centre, and the policy number carries all three. Two different covers cannot produce the same engraving. The control is a route — no cover, so no parameters, so the plate ships with zero curves rather than a degenerate circle.
The 15 pages you get
- Home
/ - The certificate, the broker’s position, the covers and the quote close.
- What we cover
/cover/ - Home, van, shop and trade. The index.
- Four cover pages
/cover/… - Household, van and fleet, shop and premises, trade and liability. Each a full route with its own engraving cut from its own parameters.
- What is not covered
/cover/none/ - The exclusions page — and the build’s declared control, where no cover means no parameters and a plate with zero curves.
- Making a claim
/claims/ - What to do when it goes wrong. The page that proves a broker is worth more than a comparison site.
- Get a quote
/quote/ - A working form plus two live tel: paths.
- About
/about/ - Independent, and where. Local independence is the whole proposition.
- Notes
/notes/ - A wired content collection — add an .mdx file and it appears here and in the sitemap.
- Two worked articles
/notes/… - Underinsurance and the average clause, and why flood is placed separately. Plain answers to the questions that come up twice a week.
- Privacy and cookies
/privacy/ - A real legal route.
- 404
/404 - Designed, not default. Keeps the navigation.
What is in the build
- A guilloche engine cutting a real hypotrochoid whose gearing is the policy itself — sum insured, term and excess each drive a parameter, so two different covers cannot produce the same engraving
- A declared control route: no cover, therefore no parameters, therefore a plate with zero curves rather than a degenerate circle
- A certificate layout with a counterfoil rail and perforation lines cutting the sections
- Four cover routes plus an explicit exclusions page, which is the honesty a broker can offer that a comparison site cannot
- A claims route — the page that justifies using a broker at all
- Alegreya with Inconsolata, both self-hosted; a working quote form plus two live tel: paths
- Vitest and Playwright suites included in the repository
The design decision
Every template in this catalog is loud in exactly one channel and deliberately quiet in the other three. That single rule is what stops 62 different worlds reading as one design system in different paint.
- The world
- A certificate of insurance in tobacco brown and paper cream, with a counterfoil rail down the right edge and perforation lines cutting the sections. One accent carries the policy number, the CTA and the endorsement stamp.
- The mechanic
- "The Certificate": one guilloche engine cuts the hypotrochoid a real rose engine traces, and its gearing is the policy — sum insured sets the teeth on the fixed gear at one per £10,000, term sets the rolling gear, excess throws the pen off centre, and the policy number carries all three. Two different covers cannot produce the same engraving.
- Loud channel
- Texture
- Imagery. One ink, paper white
- Type & palette
- Alegreya · Inconsolata
-
#e8c68c#201c12#7e2e10 - The control case
- /cover/none/ — no cover, so no parameters, so the plate ships with zero curves rather than a degenerate circle.
Who it is for
Built for independent insurance brokers and agencies placing commercial and personal lines. It suits a broker competing against comparison sites on advice, claims handling and local knowledge. For financial planning, the financial-advisor build is the sibling; for mortgage broking, mortgage-broker.
Under the hood
- Astro 7 · static output, zero client framework
- Tailwind 4 · one @theme block holds the palette
- MDX content collections for the blog
- GSAP + Lenis for the scroll work, reduced-motion aware
- Self-hosted woff2 — no Google Fonts request
- Sitemap, canonicals and per-route meta wired
- Vitest + Playwright suites in the repository
- Zero third-party requests · strict CSP-ready
How to get started
- 01 Accept the repository invite and clone it.
- 02 Run
npm install, thennpm run dev. - 03 Replace the content in
src/data/with your own — that is where the brand, the copy and every list live. - 04 Swap the images in
public/images/and the palette in the@themeblock. - 05 Run
npm run buildand deploydist/anywhere static.
Questions
Does the engraving change per policy type?
Yes, and it has to — the gearing comes from sum insured, term and excess, so household and fleet cut visibly different plates. It is the design equivalent of what a broker does: the same engine, different parameters, a different result.
I am regulated. Can I add the required statements?
Yes. Privacy is a real route and the footer carries space for regulatory registration and complaints information. Review the demo copy against your regulator’s rules before publishing.
Why an exclusions page?
Because the commodity competitors will never publish one, and it converts. A broker that states clearly what is not covered reads as the person who will actually be on the phone when a claim is disputed.
What exactly do I get for $49?
Access to a private GitHub repository holding the complete Astro source of this template — every route you see in the preview, the content model, the images and the tests. Updates arrive in that same repository.
How many sites can I build with one licence?
As many as you like, for yourself or for clients. The licence is per buyer, not per project. The one thing you may not do is resell or redistribute the source as a template, theme or starter kit.
Do I need to know Astro?
It helps, but the common case is editing content and colour. Content lives in typed objects under src/data, colour lives in one @theme block, and npm run dev shows the result. Deploying is a static folder — Cloudflare Pages, Netlify and Vercel all take it as-is.
Is anything loaded from a third party?
No. Fonts are self-hosted woff2, there is no analytics, no tag manager, no CDN script and no external CSS. The build ships static HTML under a strict Content-Security-Policy.
More professional services templates
HALLREN Counsel LLP
Corporate & litigation counsel
Loud
Moving set-piece
Sightline Capital
Financial advisory
Loud
Moving set-piece
WARDENBY
Estate agency / lettings
Loud
Imagery
Balsworth & Co.
Chartered accountancy practice
Loud
Display type
MARLEDGE FINANCIAL PLANNING
Financial planning & advice
Loud
Display type