← Back to UI screens

Also for WordPress: MGD Dental Bento, the same layout as an installable block theme.

Dental website (bento) template — web, playful style
Theme

Dental website (bento) template — web, playful style

Dental website, Bento layout website template for a website, designed for Fennick Dental, a fictional dental business. Shows a full home page for a family and cosmetic dental practice: tile mosaic for the hero and services, floating pill navigation, rounded and friendly. Playful style: vivid purple, Fredoka headings with Nunito, pill buttons, rounded cards and soft 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
Dental website
Device
Web
Style
Playful
Product (fictional)
Fennick Dental
Category
Dental

Spec

Colours (light)
background #faf8ff · surface #ffffff · text #1e172a · muted #675e78 · primary #8244cf · accent #b25600
Colours (dark)
background #130d1d · surface #20192c · text #f0ecf9 · muted #b4acc5 · primary #be98ff · accent #ff8f3f
Fonts
Fredoka (headings), Nunito (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 or cosmetic dental practice that wants a friendly, bright look.
Not ideal for
A practice that wants a formal, reserved tone.
dental-websitewebdentalwebsite-templatelanding-pageresponsivefaqnavigation-headerfooter
AI

Build this with your AI

Fonts: Fredoka + Nunito (Google Fonts)

Writing about this template?

More dental website templates

Dental practice website home page — web, minimal (Fennick Dental)
web · minimal
Dental website, Ledger layout — web, minimal (Fennick Dental)
web · Ledger · minimal
Dental practice website home page — web, editorial (Fennick Dental)
web · editorial
Dental website, Folio layout — web, editorial (Fennick Dental)
web · Folio · editorial
Dental practice website home page — web, brutalist (Fennick Dental)
web · brutalist
Dental practice website home page — web, luxury (Fennick Dental)
web · luxury
Dental practice website home page — web, playful (Fennick Dental)
web · playful
Dental practice website home page — web, corporate (Fennick Dental)
web · corporate
Dental website, Atlas layout — web, corporate (Fennick Dental)
web · Atlas · corporate
Dental practice website home page — web, retro (Fennick Dental)
web · retro
Dental website, Band layout — web, retro (Fennick Dental)
web · Band · retro
Dental practice website home page — web, monochrome (Fennick Dental)
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