Three-column feature grid
Three features in a grid, each with an icon, title, and description. The standard equal-weight feature block.
features/grid/default
Feature section templates
Present what the product does: icon grids, alternating zigzag rows with images, bento compositions and vertical lists. From three-item overviews to dense capability walkthroughs.
16 variants · neutral wireframe · ready to reskin with your design tokens
Three-column feature gridCentered three-column gridFour-column feature gridFeature grid with imagesZigzag features with linksZigzag with section headerCompact zigzagDense zigzag (four rows)Bento grid with hero cardTwo-by-two bento squaresSix-cell bento gridBento with tall feature cardNumbered vertical feature listVertical feature list (text only)Vertical list with CTA linksChecklist feature list
Centered three-column grid
Three centered feature cards with large rounded icons. Balanced, modern presentation.
features/grid/centered
Four-column feature grid
Four feature cards with icons in a grid. Fits one more feature than the 3-up variant.
features/grid/four-cols
Feature grid with images
Three feature cards with images instead of icons. Good for visual product demonstrations.
features/grid/with-images
Zigzag features with links
Three alternating text/image rows with sequential numbers and CTA links. Explains features in depth with strong rhythm.
features/zigzag/default
Zigzag with section header
Three alternating text/image rows under a centered section heading. Zigzag storytelling with a unified intro.
features/zigzag/with-header
Compact zigzag
Two alternating rows in a tighter zigzag layout. For brief feature narratives.
features/zigzag/compact
Dense zigzag (four rows)
Four alternating text/image rows. For comprehensive feature walkthroughs.
features/zigzag/dense
Bento grid with hero card
Asymmetric bento: first card spans two columns and two rows with an image; two smaller icon cards complete the grid.
features/bento/default
Two-by-two bento squares
Four equal cards in a 2x2 grid with images. Balanced bento for feature parity.
features/bento/square-2x2
Six-cell bento grid
Six cards in an asymmetric bento: two large cards on top, four smaller icon cards below. Maximum visual variety.
features/bento/six-cells
Bento with tall feature card
Five-card bento where the first card spans two rows with an image. Hierarchizes one flagship feature over four secondary ones.
features/bento/tall-feature
Numbered vertical feature list
Four numbered items stacked vertically, each with text left and image right. Sequential narrative.
features/vertical-list/default
Vertical feature list (text only)
Five numbered items with titles and descriptions, no images. Compact text-focused list.
features/vertical-list/no-images
Vertical list with CTA links
Three numbered items, each with a CTA link. Drives conversion from feature exploration.
features/vertical-list/with-cta
Checklist feature list
Six items in a two-column checklist with checkmarks. Good for capability inventories.
features/vertical-list/checklist
claude mcp add --transport http rifframe https://rifframe.app/api/mcp > "Add a features section to my landing page"
Your coding agent can search and pull these sections directly. How it works.