← Back to UI screens

Also for WordPress: MGD Veterinary Signature, the same layout as an installable block theme.

Veterinary website template — mobile, editorial style
Theme

Veterinary website template — mobile, editorial style

Veterinary practice website home page website template for a mobile website, designed for Bramblecote Vets, a fictional veterinary business. Shows a warm illustrated veterinary practice home page: navigation with call and booking buttons, a centred hero above a hillside panorama of a dog, cat, rabbit and guinea pig, a who’s-your-patient picker with working animal tabs and typical services for each, an urgent and out-of-hours call band, a services list with dotted leaders and appointment lengths, a wellness plan comparison table with monthly prices for puppies and kittens, adult and senior pets, a new pet checklist beside what to bring, a noticeboard of vets and nurses with their own pets and a training slot, a repeat prescription request form, a booking form with pet name, species and age beside opening hours and a map, and a footer. Editorial style: warm paper tones, Instrument Serif headlines with Inter body text and tabular figures, square corners. A complete, responsive one-page HTML template (every section, light and dark) with a DESIGN.md of light and dark colour tokens.

Open live HTML ↗ Download DESIGN.md
Pattern
Veterinary website
Device
Mobile
Style
Editorial
Product (fictional)
Bramblecote Vets
Category
Veterinary

Spec

Colours (light)
background #fffbf4 · surface #f6ecdc · text #271e0f · muted #6d624e · primary #bd4e43 · accent #008f96
Colours (dark)
background #191307 · surface #2a2214 · text #f5f0e8 · muted #bab09e · primary #ff9487 · accent #62d2d9
Fonts
Instrument Serif (headings), Inter (body), JetBrains Mono (code) · Google Fonts, under their own licences
Sections
hero, your pet, urgent, services, wellness plans, new pets, our team, repeat prescriptions, book an appointment, footer
Light and dark
Both included; follows the system setting
Responsive
One HTML file, layout changes at 1024px, 960px and 760px; no horizontal scroll at 320px
Best for
A neighbourhood veterinary practice that wants a magazine-like look led by type.
Not ideal for
A practice that wants a compact layout with very little text.
veterinary-websitemobileveterinarynavigation-headerheroillustrationanimal-pickertabsurgent-bannerservicescomparison-tablepricing-tablechecklistwhat-to-bringteamcredentials
AI

Build this with your AI

Fonts: Instrument Serif + Inter (Google Fonts)

Writing about this template?

More veterinary website templates

Veterinary practice website home page — web, editorial (Bramblecote Vets)
web · editorial
Veterinary website, Folio layout — web, editorial (Bramblecote Vets)
web · Folio · editorial
Veterinary practice website home page — mobile, minimal (Bramblecote Vets)
mobile · minimal
Veterinary website, Ledger layout — mobile, minimal (Bramblecote Vets)
mobile · Ledger · minimal
Veterinary website, Folio layout — mobile, editorial (Bramblecote Vets)
mobile · Folio · editorial
Veterinary practice website home page — mobile, brutalist (Bramblecote Vets)
mobile · brutalist
Veterinary practice website home page — mobile, luxury (Bramblecote Vets)
mobile · luxury
Veterinary practice website home page — mobile, playful (Bramblecote Vets)
mobile · playful
Veterinary website, Bento layout — mobile, playful (Bramblecote Vets)
mobile · Bento · playful
Veterinary practice website home page — mobile, corporate (Bramblecote Vets)
mobile · corporate
Veterinary website, Atlas layout — mobile, corporate (Bramblecote Vets)
mobile · Atlas · corporate
Veterinary practice website home page — mobile, retro (Bramblecote Vets)
mobile · retro
Building with an AI coding agent? Every screen here is also in the free Made Good Designs MCP server: ask Claude, Cursor or ChatGPT to search_ui_screens (e.g. “billing settings, editorial style”), get_ui_flow for a whole journey, and get_ui_screen_code to pull the HTML and DESIGN.md straight into your project.

Save to board