Skip to content

Seeded reference page: one example of each layout block available on pages (see Pages → Content in the admin).

Below, each section demonstrates a single block type. Edit this page in the admin to inspect field structure.

BLOCK

CALL TOACTION

Right column body copy for the Call to Action block.

Content block — column A (half width).

Content block — column B (half width).

Curving abstract shapes with an orange and blue gradient

Photo by Andrew Kliatskyi on Unsplash.

Curving abstract shapes with an orange and blue gradient
Second media item

Style guide PDF

A generated one-page PDF for validating the PDF viewer block.

Archive block: posts from the collection (limit 3 for the demo).

Form block with intro enabled.

Slide one

Slide one

Short description

Optional longer text for the first carousel item.
Slide two

Slide two

Second slide

Another item to exercise carousel navigation.

Content With Hours block main column.

Curving abstract shapes with an orange and blue gradient
Link

Style guide download

A seeded external download example.

External Link

Iframe URL example

Curving abstract shapes with an orange and blue gradient

Featured card

A standard featured card with a link.

Curving abstract shapes with an orange and blue gradient

Featured overlay

SUPPORTERS

Funding block

Funding block description.

Example sponsor
Straight metallic shapes with a blue gradient

In-page Hero Slider block (separate from the page-level hero tab).

TRUSTED BY

Logos block

Curving abstract shapes with an orange and blue gradient

METRICS

NUMBERS BLOCK

0+

LAYOUT BLOCKS ON THIS PAGE

0%

SEEDED DEMO DATA

PROCESS

PROCESS BLOCK

Discover

Optional step description text.

Build

Second step in the process list.

TABS BLOCK

HEADING + TABS

Content for tab A.

Column one

Column one

Subtitle

Rich text in the first column item.

Column two

Column two

Subtitle

Rich text in the second column item.

Card A

Card A

Card description

Card body rich text.

Footer line

Card B

Second card without image.

⚡
42
Latency
ms (demo)
★
100
Satisfaction
% (demo)

Single testimonial mode: quote, author, role, and company fields.

Demo Author · Product, Example Co.
Featured tile
Featured tile
Gallery image 2
Gallery image 3
✓

Feature one

Feature description with optional icon.

★

Feature two

Second feature in a simple grid layout.

THEHIGHLIGHTS

Page

Style guide

Purpose

Block QA

Highlight card

Short supporting copy on the highlight card.

With image

Optional background image on a highlight card.

Quote block: pull quote with optional author metadata.

Demo quote
Writer, Example
●
Phase 1

Kickoff

Timeline description for the first milestone.

2
Phase 2

Ship

Second milestone on the timeline.

YouTube embed (demo ID)

Video grid item

A video card within the Videos block.

Popular

Starter

0/mo

Demo plan row

  • ✓All blocks on one page
  • ✓Safe to delete in production
Alex Example

Alex Example

Engineer

Short biography text for a team member card.

RS

Riley Sample

Design

Second member without a photo.

Quick Info block intro content.

Learn more

Quick info card

Quick Info card content.

Upcoming events

Upcoming events from the events collection.

No events are scheduled.

Resources

Published resources from the resources collection.

No resources are available.

Schedule block

Seasonal schedule details.

January:

Weekdays: 9 AM – 5 PM.

Example operating schedule
DayHours
Monday9 AM – 5 PM

Banner block — informational style variant.

1export const styleguideSlug = 'styleguide'
2