Feature Sections
Feature sections highlight what your product or service does. ClearCMS includes two layouts: a grid for listing multiple features, and a showcase for spotlighting a few key capabilities.
Features Grid
ID: features-grid-v2
A responsive grid of feature cards, each with an icon, title, and description. Displays 3 columns on desktop, 2 on tablet, and 1 on mobile.
Live preview
Fields
| Field | Type | Label | Default |
|---|---|---|---|
eyebrow | text | Eyebrow | Features |
headline | text | Headline | Everything you need |
description | textarea | Description | Powerful tools to help your team succeed. |
features | array | Features | 6 default feature cards |
Feature item fields:
| Field | Type | Label | Default |
|---|---|---|---|
icon | icon | Icon | zap |
title | text | Title | Feature |
description | textarea | Description | Feature description |
Default content
Eyebrow: Features
Headline: Everything you need
Features: 6 cards with icons (zap, shield, clock, etc.)
When to use
Best when you have 3-9 features to highlight with equal weight.
Tips
- Use 3 or 6 features for the cleanest grid on desktop.
- Icon names come from the built-in set (e.g.,
zap,shield,clock,users,layers,globe).
Feature Showcase
ID: feature-showcase-v2
Alternating rows of image + text. Each row highlights a single feature with a large image, title, description, and optional CTA link. The image side alternates left/right between rows.
Live preview
Fields
| Field | Type | Label | Default |
|---|---|---|---|
eyebrow | text | Eyebrow | How it works |
headline | text | Headline | A better way to build |
showcaseItems | array | Showcase Items | 3 default items |
Showcase item fields:
| Field | Type | Label | Default |
|---|---|---|---|
eyebrow | text | Eyebrow | Feature |
title | text | Title | Feature Title |
description | textarea | Description | Feature description |
image | image | Image | -- |
ctaLabel | text | CTA Label | Learn more |
ctaHref | url | CTA Link | # |
Default content
Eyebrow: How it works
Headline: A better way to build
Items: 3 alternating image/text rows with CTAs
When to use
Best for 2-4 features that each deserve a full-width row with a large image. Works well for "How it works" flows and product walkthroughs.
Tips
- Use landscape images (4:3 aspect ratio) for each item.
- Each item can have its own CTA link pointing to a dedicated page.