Opens in a new tab

hero--graphic

Light hero with client artwork

Artwork drawn on white is multiply-blended into the --bg-alt band, so it needs no transparency. Replace the placeholder with the client's graphic.

Area colours + link-card

One class recolours a whole section

data-table

Bordered price / comparison table

Licence Personal Small Business Business Enterprise
Standard $225 $1,663 $6,075 $11,675
Standard + add-on $275 $3,325 $12,150 $17,750
Everything included, with a long row label that wraps $388 $5,025 $18,550 $23,675
Example figures. US$ excluding GST.

content-layout + content-aside + aside-card (--toc) + figure-frame + file-list

Article with a sticky sidebar

Overview

The sidebar stays put on desktop. On tablets and phones the “On this page” card (aside-card–toc) moves above this text and the other cards follow it. Jump links land below the sticky header.

Downloads (file-list)

Details

Inline code uses the text colour on a light tint so it stays readable. Captions use –text-muted.

Example chart
figure-frame: caption sits below the image

On this page

Talk to us

Short call to action.

Contact

explore-grid

Whole-card links

Services

The whole card is the link; focus ring on keyboard.

Explore →

Products

Cards fill the row and wrap.

Explore →

Resources

Top rule uses the area colour.

Explore →

FAQs

Hover lifts the card.

Explore →

logo-grid

Partners and clients

  • Partner 1
  • Partner 2
  • Partner 3
  • Partner 4
  • Partner 5
  • Partner 6

person-grid + person-card

Everyone gets a blurb

Managing Director

Alex Example

B.Eng, MBA

Short one-line intro. The full CV opens below.

Full profile
  • Longer CV point one
  • Longer CV point two
  • Longer CV point three

Lead Developer

Sam Sample

B.Sc

Duplicate a card to add a person.

Full profile
  • Longer CV point one
  • Longer CV point two
  • Longer CV point three

Consultant

Jo Placeholder

Qualifications line is optional.

Full profile
  • Longer CV point one
  • Longer CV point two
  • Longer CV point three