← Back to UI screens

Also for WordPress: MGD Hospital Band, the same layout as an installable block theme.

Hospital website (band) template — mobile, retro style
Theme

Hospital website (band) template — mobile, retro style

Hospital website, Band layout website template for a mobile website, designed for Tarrowmere Community Hospital, a fictional hospital business. Shows a full home page for a community hospital with outpatient clinics and a minor injuries unit: full-width colour bands, an oversized headline, sticky section titles, large numbered steps. Retro style: warm cream, soft Fraunces headings with DM Sans, outlined cards and offset colour shadows. 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
Hospital website
Device
Mobile
Style
Retro
Product (fictional)
Tarrowmere Community Hospital
Category
Hospital

Spec

Colours (light)
background #fef5ef · surface #f3e5d9 · text #25180e · muted #715f52 · primary #c2454e · accent #3d8930
Colours (dark)
background #130904 · surface #25190f · text #f5ede7 · muted #beaea1 · primary #ff9293 · accent #8ddb80
Fonts
Fraunces (headings), DM Sans (body), JetBrains Mono (code) · Google Fonts, under their own licences
Sections
services, process, team, FAQ, visit, 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 community hospital that wants a warm, nostalgic look.
Not ideal for
A hospital that wants a sleek, present-day look.
hospital-websitemobilehospitalwebsite-templatelanding-pageresponsivefaqnavigation-headerfooter
AI

Build this with your AI

Fonts: Fraunces + DM Sans (Google Fonts)

Writing about this template?

More hospital website templates

Hospital website, Band layout — web, retro (Tarrowmere Community Hospital)
web · Band · retro
Hospital website, Ledger layout — mobile, minimal (Tarrowmere Community Hospital)
mobile · Ledger · minimal
Hospital website, Folio layout — mobile, editorial (Tarrowmere Community Hospital)
mobile · Folio · editorial
Hospital website, Concierge layout — mobile, luxury (Tarrowmere Community Hospital)
mobile · Concierge · luxury
Hospital website, Bento layout — mobile, playful (Tarrowmere Community Hospital)
mobile · Bento · playful
Hospital website, Atlas layout — mobile, corporate (Tarrowmere Community Hospital)
mobile · Atlas · corporate
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