← Back to UI screens

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

Pediatrics website template — web, retro style
Theme

Pediatrics website template — web, retro style

Pediatrics website home page website template for a website, designed for Wrenfold Children's Clinic, a fictional pediatrics business. Shows a parent-first pediatric clinic home page: navigation with call and book buttons, a hero whose headline asks is your child sick today, answered by a yes panel routing to same-day sick visits, the nurse advice line and after-hours care with an emergency line, beside a not-today panel, a well-child visit schedule by age on a height chart of growing children from newborn to yearly checkups, a first visit and new parent guide with a what-to-bring checklist, a floor plan of the separate well and sick waiting areas, a parent portal on a phone with feature list, short general reading for parents, clinicians with interests and a marked credentials slot, opening hours beside a booking form with the child’s name and age, and a footer. 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
Web
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
sick today, checkups, new parents, two sides, portal, reading, clinicians, book a visit, footer
Light and dark
Both included; follows the system setting
Responsive
One HTML file, layout changes at 1180px, 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-websitewebpediatricsnavigation-headerheroroute-panelsame-day-bookingnurse-lineafter-hoursemergency-noticevisit-scheduleheight-chartnew-parent-guidechecklistfloor-planpatient-portal
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, minimal (Wrenfold Children's Clinic)
web · minimal
Pediatrics website, Ledger layout — web, minimal (Wrenfold Children's Clinic)
web · Ledger · minimal
Pediatrics website home page — web, editorial (Wrenfold Children's Clinic)
web · editorial
Pediatrics website, Folio layout — web, editorial (Wrenfold Children's Clinic)
web · Folio · editorial
Pediatrics website home page — web, brutalist (Wrenfold Children's Clinic)
web · brutalist
Pediatrics website home page — web, luxury (Wrenfold Children's Clinic)
web · luxury
Pediatrics website home page — web, playful (Wrenfold Children's Clinic)
web · playful
Pediatrics website, Bento layout — web, playful (Wrenfold Children's Clinic)
web · Bento · playful
Pediatrics website home page — web, corporate (Wrenfold Children's Clinic)
web · corporate
Pediatrics website, Atlas layout — web, corporate (Wrenfold Children's Clinic)
web · Atlas · corporate
Pediatrics website, Band layout — web, retro (Wrenfold Children's Clinic)
web · Band · retro
Pediatrics website home page — web, monochrome (Wrenfold Children's Clinic)
web · monochrome
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