Skip to main content

Components

The building blocks for page content: cards and grids, tabs and accordions, navigation helpers and media components. Each sub-page shows a live example, the code (sample, empty template, template with options) and the options table.

Grids & Cards

Basic Grid and Basic Card: the standard building block for card layouts and portfolios.

Open

Side Image Card

Image-plus-text card (image 40 %, left or right), stacks on mobile; five modifier classes.

Open

Topics Grid

Compact topic tiles on a coloured or gradient surface with hover lift.

Open

Masonry Grid

Staggered tile grid with expandable text drawers.

Open

Dossier Grid

Case-study dossiers: hero image, logo, tabs and scroll reveal.

Open

Slider Grid

One-card carousel (vertical fade or slide) around any card.

Open

Logo Grid

Logo grid for press and clients with fine lines in eleven colours.

Open

Grids & Cards – Reveal

Sixteen reveal effects for images with content behind the picture.

Open

Tabs

Basic Tabs with sliding underline and automatic back/next footer; Side Tabs.

Open

Accordions

Card accordion: expandable cards with a gradient head.

Open

Show More

Collapses long text behind a [...] marker, inline or as a block.

Open

Section Navigator

In-page jump navigation with progress indicator.

Open

Logic Path

Numbered chain-of-thought list with 'More' pill buttons.

Open