Every composition for the workhorse section.
Features is the section that carries most marketing pages: services, benefits, capabilities. Below, one dental practice presents the same services through every display style and card style the section supports.
Care for every stage of your smile.
The classic card grid. Surface, border, radius, and icons, all driven by the global design system.
Preventive care
Cosmetic dentistry
Advanced technology
Gentle checkups
Clear treatment plans
Same-day restorations
Flip the image below the copy.
Every card defaults to image-on-top — but a single Image Position toggle moves the photo below the content instead: heading and copy first, then the image. Nothing else about the card changes (surface, radius, spacing, smart colors all stay put), so it still matches the grid above; only the image order flips. Compare it with the grid directly above.
Preventive care
Cosmetic dentistry
Advanced technology
Gentle checkups
Clear treatment plans
Same-day restorations
The same services, without the chrome.
Minimal drops the card surfaces so the content sits directly on the section. Best when the page already has plenty of cards.
Preventive care
Cosmetic dentistry
Advanced technology
Why patients switch to Brightside.
The bordered treatment draws a connected rule between cards, a quieter alternative to full card surfaces.
Transparent pricing
Anxiety-friendly
One location, every specialty
Explore the practice.
Hero cards are image-led and fully clickable, with a persistent arrow affordance.
Two reasons to book the first visit.
Inline consolidates one or two cards beside the section copy instead of below it. With the Cards style they render as true cards, honoring the global card treatment.
New patient special
Free Invisalign consult
The essentials, at a glance.
The same inline composition with the Minimal card style: no surfaces, just aligned content beside the message.
Hours that fit work schedules
Most insurance accepted
Signature treatments, front and center.
Showcase highlights two or three image-rich cards with extra emphasis and spacing, built for focal-point moments.
Smile makeovers
Same-day crowns
A calmer kind of dentistry.
The offset composition: copy and stacked items in a left column while the featured image bleeds to the right edge of the viewport. A deliberate editorial break in the page rhythm.
Listen first
Explain everything
Never rush
Free patient info sessions.
The Events display mode adds date, time, and location fields to every card, turning the section into a schedule.
Invisalign open house
Kids first-visit night
Sleep and snoring seminar
Every service, on one rail.
The carousel arrangement puts the same service cards on a horizontal scroll-snap rail. Auto sizing fits about three cards on desktop with a peek of the next; drag, arrows, dots, and the keyboard all navigate. Switching a grid to a carousel changes nothing about the cards themselves.
Three at a time, with a peek.
A fixed three-up count with peek on: exactly three cards fill the width and a sliver of the fourth signals there is more to scroll. Dark theme, arrows and dots re-derive their contrast automatically.
Four across, flush.
Four cards per view with peek off, so exactly four fill the width with no sliver. The minimal card style drops the surfaces, and dots are hidden — arrows, swipe, and keyboard still navigate.
Two up, moving on its own.
Two cards per view with autoplay and loop on: the rail advances every four seconds and wraps at the ends. A pause/play button appears; it pauses on hover, on keyboard focus, and when the tab is hidden, and never starts under reduced motion.
One signature service at a time.
Slides-per-view of one is the spotlight treatment: each card with an image lays out as a large media-and-copy split you page through, the modern feature-tour format. Autoplay advances every six seconds; the same lossless cards, a bigger stage.