QuayMed Medical Clinic Website Template preview 1
Free

QuayMed Medical Clinic Website Template

bookmark

A modern, responsive GP clinic website template for The Doctors QuayMed — deep navy + green brand palette, 5 complete pages, Phosphor Icons, vanilla HTML/CSS/JS, zero build step.

HTML5CSS3JavaScriptPhosphor IconsGoogle FontsHealthcareMedicalhealthcare

QuayMed — Medical Clinic Website Template

A modern, responsive general practice clinic website template — redesigned by Themedown for The Doctors QuayMed, a Cornerstone Accredited GP practice in Auckland CBD. Free for personal and commercial use.

Quick Start

bash
git clone https://github.com/themedown-templates/quaymed-redesign.git
cd quaymed-redesign
# Open index.html in your browser, or use a local server:
npx serve .

No build step. No npm install. Just open and go.

Pages

PageDescription
HomeFull-width hero + 5-item trust strip + dual clinic cards + 6-service grid + patient task panel + connected care + people/VLCA split + hours summary + FAQ accordion + booking CTA
ServicesPage hero + 10-service numbered directory (consultations, injuries, child health, maternity, sexual health, travel medicine, medicals, well person checks, minor surgery, workplace health)
TeamPage hero + collaborative care feature + 4 role cards (doctors, nursing, admin, allied health) + team portrait banner + 3 values grid + CTA
ContactPage hero + emergency warning aside + dual location cards (Britomart & Wynyard) with full details + enquiry form (name, email, phone, clinic select, message)
Hours & FeesPage hero + dual schedule tables + 4 info cards (enrolment, patient fees, results, pay by link) + after-hours notice + CTA

Tech Stack

  • HTML5 — Semantic, accessible markup with ARIA
  • CSS3 — Custom properties, CSS Grid, Flexbox, clamp() fluid typography, backdrop-filter
  • JavaScript — Vanilla JS (mobile menu toggle, contact form handler)
  • Phosphor Icons — CDN-loaded consistent icon set
  • Google Fonts — Inter (body) + Plus Jakarta Sans (headings)

Features

  • Fully responsive — mobile-first, hamburger menu below 1080px
  • Deep navy + fresh green brand palette (10 design tokens)
  • Sticky header with backdrop blur
  • Full-width hero with editorial image strip
  • 5-item trust bar (Cornerstone accredited, two locations, hours, booking, one team)
  • Dual clinic location cards with photos and contact details
  • 6-service grid + patient task quick-link panel
  • Connected care split card (text + image)
  • People/VLCA split panel with benefit checkmarks
  • Hours summary grid + FAQ accordion
  • Booking CTA band with green-tint background
  • Full-site footer with dual clinic contact columns
  • Skip-to-content accessibility link
  • Focus-visible outlines for keyboard navigation
  • Zero build tools, zero dependencies — works from a static folder

Design System

See docs/design.md for the complete design specification — brand color tokens, typography scale, layout principles, component behaviors, and anti-patterns.

License

MIT — free for personal and commercial use.

help_outline

FAQ