How Sunridge Dental was designed and built

The concept

Sunridge Dental is a portfolio concept for an upbeat, family-first practice. Where most dental sites reach for clinical blues and whites, this one leans warm and bold: cocoa brown, a chartreuse lime and a soft lavender, with big friendly type and rounded pill buttons. The goal was a site that a family with young kids would find welcoming rather than intimidating.

Palette and type

Cocoa brown is the dominant neutral and carries the header, footer and feature panels. Lime is the single accent and is used sparingly for calls to action, the rating chip and the sunburst behind each team portrait. Lavender appears only as a supporting tint. Plus Jakarta Sans, a rounded geometric sans, is used throughout in heavy weights for headlines and a comfortable medium weight for body copy.

Structure

This is a complete multi-page site: Home, a services index with an individual page for each of the twenty-seven treatments, About, Team, New Patients, Insurance and Financial, Smile Gallery, Reviews and Contact. Every inner page shares a lighter cream shell with the same navigation, footer and phone call to action, so visitors never lose their bearings when they click deeper.

Signature motion

The home page introduces the team as a row of circular portraits, each sitting on a slowly rotating sunburst of lime rays that keeps turning behind the photo. Headline stat numbers count up as they scroll into view, an oval feature photograph breaks the grid mid-page, and the footer ends on a giant lime wordmark that slides up into place. Reveals are tied to native scroll position and are disabled for visitors who prefer reduced motion.

Imagery

All photography is licensed stock, chosen to match the text it accompanies: the dentist appears in a white clinical uniform with the operatory behind him, the team wear scrubs, the treatment room shot is a bright modern suite, and the smile gallery uses close-up results photography grouped by treatment type. The patient avatars beside the rating chip are stock portraits, not real patients.

Stack

Static HTML, CSS and JavaScript with no build tooling, deployed as a plain folder. Contact forms use Netlify Forms with a honeypot. Before launch the site was swept at 375, 768 and 1280 pixel widths for overflow, checked for colour contrast against WCAG AA, and every internal link and image reference was verified.