Features & Content
Icon Feature Grid
The most-used module in Tonic. A grid of icon + heading + description items with configurable column count and item layout.
Fields
- Eyebrow, Heading, Subtext — Optional section header above the grid.
- Items (repeater) — Each item has: Icon (emoji or SVG), Title, Description (rich text), optional Link text and URL.
- Columns (desktop) — 2, 3, or 4. Always collapses to 1 column on mobile.
- Item layout — Icon Top (icon above text) or Icon Left (icon inline with text).
Feature List
Checklist-style feature display. Each item has an icon, title, description, and optional link. Good for "What's included" sections and comparison-adjacent content.
Cards Repeater
Flexible card grid. Each card supports a media area (image, icon, or none), eyebrow, heading, description, and button. Column count and media position are editor-controlled.
Media position options
- Top — Media above the card content. Standard blog-card style.
- Left — Media to the left of text. Good for icon-driven feature lists in card form.
- None — Text-only card with optional icon.
Process Steps
Numbered or icon-driven step sequence. Optional connector lines between steps. Two orientations: Horizontal (left to right) and Vertical (stacked).
Fields per step
- Node type — Number (auto-incremented) or Icon (custom emoji/SVG).
- Step title — Heading for this step.
- Description — Rich text body for this step.
- Link text / URL — Optional "Learn more" link per step.
Timeline
Date-labeled vertical timeline. Each item has a date label, heading, and description. Useful for company history, product roadmaps, case study progression, and event sequences.
Section Header
Standalone eyebrow + heading + subheading + optional CTA module. Use between content sections when you need a titled separator without a full content block. Supports left, center, and right text alignment.