← Back to UI screens

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

Pediatrics website template — web, brutalist style
Theme

Pediatrics website template — web, brutalist 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. Brutalist style: high contrast, Space Grotesk, uppercase headings, thick black borders and hard offset 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
Brutalist
Product (fictional)
Wrenfold Children's Clinic
Category
Pediatrics

Spec

Colours (light)
background #fbfbf9 · surface #ffffff · text #1e1c15 · muted #666358 · primary #947c08 · accent #576dcc
Colours (dark)
background #14130f · surface #212019 · text #efefee · muted #b3b1a8 · primary #dab700 · accent #93abff
Fonts
Space Grotesk (headings and 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 bold, high-contrast look with hard edges.
Not ideal for
A practice that wants a soft, gentle look.
pediatrics-websitewebpediatricsnavigation-headerheroroute-panelsame-day-bookingnurse-lineafter-hoursemergency-noticevisit-scheduleheight-chartnew-parent-guidechecklistfloor-planpatient-portal
AI

Build this with your AI

Fonts: Space Grotesk (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, 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 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 — 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