This is the kitchen-sink page — every component renders here once.

Skyline aerial view

Component library

Every component, on one page

Glass hero, stat band, cards, splits, galleries, accordions — the whole set.

Inner pages

Page hero (light)

The inner-page banner.

With an eyebrow

Heading primitive


City street at dusk
Image primitive with offset-accent frame.

Stat band

Numbers as graphic

98%

satisfaction

42

components

7

days to launch

AA

accessibility

Card grid

spark-card rollovers

Team collaborating

Image card

Image-led with the default color bar.

Learn more

Skyline aerial view

Sky card

Sky family, same image treatment.

Learn more

City street at dusk

Clay card

Clay family, same image treatment.

Learn more

Bento

One feature, four compact

Breaks the uniform card matrix.

City street at dusk

$75M+

in awards secured

Feature card

The tall dark photo card. First in the slot, two rows tall.

Learn more

Compact card

Sits beside the feature at half its height.

Learn more

Fourth compact

Primary family, and the cell that squares the grid.

Learn more

Dated cards

News & events

City street at dusk

Jul 4, 2026

News card

Dated, image-led teaser.

Read more

Split

Text beside media

Alternate media_side to zig-zag down the page.

Team collaborating

A pull-quote with an oversized serif mark and attribution.

Alex Rivera Product Lead

Gallery

Captioned image grid

City street at dusk
Square crop
Skyline aerial view
Another square
Team collaborating
Third square

Accordion

Disclosure list

First question, open by default

Native details/summary — zero JS.

Second question

Answer two.

Documents

Document list

Browse all documents

Rich text

Editorial prose with the typography plugin. Links, bold, and lists:

  • One
  • Two

Mission band

Rich text with a header on the tint

The same Rich text section — an eyebrow and a title turn it into the mission band.

Dark band

The band, with anything in it

A layout primitive: it owns the dark band and the glow, the slot owns the content.

10

counties served

1968

founded

42k

residents

Map

Locations, with the list beside them

The list is the map data — pins and rows cannot drift apart.

  • Town Office

    12 Mill Street · Open 8–4

  • Public Works

    80 Depot Road

  • Recreation Center

    Riverside Park

CTA

The one dark ask

Accent and glass buttons both read on the brand-glow band.

Events

Upcoming events come to you

The events rail — first item is a dark highlight card, the rest are compact rows.

Full calendar
Portrait

Story

A place where people belong

I moved here three years ago and immediately felt at home. This is a town that invests in belonging.

— Maria Rodriguez, resident

Read her story

Logos — partner/donor recognition grid

Partner One
Partner Two
Partner Three
Partner Four
Partner Five

Timeline

How it works — a process timeline

Numbered steps with icons and bullet points.

1
Step 1

Discovery and planning

  • Stakeholder interviews
  • Scope definition
  • Timeline estimation
2
Step 2

Design and build

  • Component authoring
  • Page composition
  • Content migration
3
Step 3

Launch and train

  • Editor training
  • Go-live
  • Post-launch support

Video cards

Video library

16:9 thumbnails with a play overlay — for video gallery pages.

Video thumbnail
Tutorial

Demo video: component library walkthrough

Video thumbnail
Demo

How editors compose pages in Canvas

Video thumbnail
Architecture

From data to Drupal: the push pipeline

Contact

Send us a message

Every component renders once on this page — including the contact form.