Elementor Widget

Card GridFeatures, benefits, services — in a grid.

The Card Grid widget arranges content into clean icon-and-text cards. 2, 3, or 4 columns. Works on any section of any page.

What it’s for

When to use a Card Grid

Card Grids work wherever you need to present a set of parallel items clearly — features, benefits, services, team members, use cases. Each card has an icon, a title, a description, and an optional expandable detail panel for longer content. Cards can also link to another page.

Live example

Card Grid — 3 columns

Image generationGenerate hero images, product photos, and social graphics using Gemini, OpenAI, or Together AI. All from a single prompt.

WordPress publishingPublish posts, build Elementor pages, upload media, and manage your site — all without opening the WordPress dashboard.

SEO & researchKeyword research, content briefs, competitor analysis, and content audits. Everything you need to rank, in one place.

Key settings

What you can control

Setting	What it does
columns	Number of columns on desktop: 2, 3, or 4
columns_tablet / columns_mobile	Column count on tablet and phone — typically 2 on tablet, 1 on mobile
equal_height	Makes all cards the same height regardless of content length
card_icon	Elementor icon per card (eicon- prefix). Sets the visual theme for each card
card_detail	Optional expandable panel — shown when the card is clicked. For longer content
card_link_url	Makes the whole card clickable. Use instead of card_detail when linking to another page
icon_color / subtitle_color / title_color	Colour controls for icon, title, and description text across all cards

← All widgets Next: Data Table →

Elementor Widget

Card GridFeatures, FAQs, and services, beautifully.

A grid of clickable cards with icons, titles, and descriptions. Click any card to expand its full detail and optional link.

What it does

Clickable cards with expandable detail

The Card Grid displays a set of cards in a 2, 3, or 4-column grid. Each card shows an icon, a title, and a short description. Clicking a card expands a detail panel below the row with full text and an optional link button — only one panel is open at a time.

Best used for: feature showcases, service listings, FAQ grids, tool directories, team member cards, and anywhere you want scannable summaries with optional depth.

Live example

See it in action

Click any card below to expand its detail panel.

Key settings

What you can control

Setting	What it does
Columns	2, 3, or 4 columns on desktop. Tablet and mobile can be set separately.
Card icon	Any Elementor icon. Sets the visual identity of each card.
Card detail	Expanded text that appears below the row when a card is clicked. Optional.
Card link	Whole-card link (when no detail) or a CTA button inside the detail panel.
Equal height	Forces all cards in a row to the same height regardless of content length.
Colours	Icon colour, icon background, title, subtitle, detail text, and CTA button — all individually controllable.

← All widgets Next: Data Table →