# Features, services, benefits, and process

> Sections for explaining capabilities and benefits. The current collection includes a text-based feature tab section.

- Category ID: `features`
- Part of a page: Website sections
- Published components: 6
- Page: https://pagesugar.com/categories/features

## Components

- [Feature grid](https://pagesugar.com/components/feature-grid-01.md): A feature section: eyebrow, heading and intro over a 2, 3 or 4 column grid of features, set as cells of one hairline-ruled panel, a filled panel or ruled cards, with rows aligned by subgrid.
- [Alternating feature sections](https://pagesugar.com/components/alternating-features-01.md): A product tour as a run of text-and-media rows: a compact text column beside a larger framed image, the image swapping sides row by row from lg and stacking under the copy on phones.
- [Feature spotlight](https://pagesugar.com/components/feature-spotlight-01.md): One capability given a full section: eyebrow, heading, detailed copy, check-marked points and up to two actions beside a large screenshot or video set in a quiet frame. Media swaps sides at lg; copy stays first.
- [Feature tabs](https://pagesugar.com/components/feature-tabs-01.md): A tabbed feature section: an introduction, an underline tab row, and a panel with the feature copy beside a framed screenshot or product surface, or a points list when there is no media.
- [Feature card](https://pagesugar.com/components/feature-card-01.md): One capability on a card: an optional icon or framed image, a title with an optional badge, a short description and a detail link pinned to the bottom, so cards in a row line up.
- [Process steps](https://pagesugar.com/components/process-steps-01.md): Numbered steps of a linear process for a "How it works" section: a row with a rule running between the markers from 1024 px, a vertical rail below it, and an optional closing action.