← Back to UI screens

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

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

Pediatrics website (band) template — mobile, retro style

Pediatrics website, Band layout website template for a mobile website, designed for Wrenfold Children's Clinic, a fictional pediatrics business. Shows a full home page for a family pediatric clinic: 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
Pediatrics website
Device
Mobile
Style
Retro
Product (fictional)
Wrenfold Children's Clinic
Category
Pediatrics

Spec

Colours (light)
background #fffcf7 · surface #fdedd9 · text #291b08 · muted #72604a · primary #a4373f · accent #498d3d
Colours (dark)
background #1e1305 · surface #2e2110 · text #f8efe4 · muted #bfae99 · primary #ec8384 · accent #87ce7b
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 family paediatric practice that wants a warm, nostalgic look.
Not ideal for
A practice that wants a sleek, present-day look.
pediatrics-websitemobilepediatricswebsite-templatelanding-pageresponsivefaqnavigation-headerfooter
AI

Build this with your AI

Fonts: Fraunces + DM Sans (Google Fonts)

Writing about this template?

More pediatrics website templates

Pediatrics website home page — web, retro (Wrenfold Children's Clinic)
web · retro
Pediatrics website, Band layout — web, retro (Wrenfold Children's Clinic)
web · Band · retro
Pediatrics website home page — mobile, minimal (Wrenfold Children's Clinic)
mobile · minimal
Pediatrics website, Ledger layout — mobile, minimal (Wrenfold Children's Clinic)
mobile · Ledger · minimal
Pediatrics website home page — mobile, editorial (Wrenfold Children's Clinic)
mobile · editorial
Pediatrics website, Folio layout — mobile, editorial (Wrenfold Children's Clinic)
mobile · Folio · editorial
Pediatrics website home page — mobile, brutalist (Wrenfold Children's Clinic)
mobile · brutalist
Pediatrics website home page — mobile, luxury (Wrenfold Children's Clinic)
mobile · luxury
Pediatrics website home page — mobile, playful (Wrenfold Children's Clinic)
mobile · playful
Pediatrics website, Bento layout — mobile, playful (Wrenfold Children's Clinic)
mobile · Bento · playful
Pediatrics website home page — mobile, corporate (Wrenfold Children's Clinic)
mobile · corporate
Pediatrics website, Atlas layout — mobile, corporate (Wrenfold Children's Clinic)
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