Page sections
Integrations section
An integrations section is a block of app logos or cards showing which tools a SaaS product connects to, often with a link to its integrations directory.
- Also called
- Integrations grid, App directory, Integrations wall, Works with
- Spotted on
- 60 of 422 homepages
- Browse examples
- Feature sections →
What is an integrations section?
For most B2B software, "does it work with what we already use?" is a buying question, so the integrations section answers it on the homepage. It usually shows a grid or ring of familiar app icons with a count ("100+ Integrations") and a link to the directory.
Layouts in our reviews vary from simple grids to diagrams. Attentive draws a circular integrations diagram with a "100+ Integrations" pill; Zinley and Moss group apps by category ("EMAIL AND SCHEDULE", "LLM frameworks") so visitors find their stack faster; Twingate keeps it to a heading, a paragraph and an "Explore Integrations" button.
The weak version is a wall of fifty logos with no grouping and no link. Lead with the handful of tools your buyers care about most, group the rest, and say what the integration actually does.
When to use an integrations section, and when not to
Use it for
- B2B workflow toolsYour product's value depends on connecting to CRMs, data sources or communication tools.
- Recognizable partnersLogos like Slack, Salesforce or HubSpot reassure buyers instantly.
- Platform positioningYou want to show the product as a hub rather than a point tool.
Avoid it for
- Few integrationsThree logos in a big section highlights a gap; mention them in a feature row instead.
- Ungrouped logo wallsFifty icons with no categories are hard to scan for the one tool a visitor uses.
- Planned integrationsShowing "coming soon" logos as if they exist erodes trust when buyers check.
Anatomy of an integrations section
- 1HeadingA claim like "Connect all your marketing data" or "Works with your stack".
- 2Logos or cardsApp icons in a grid, ring or marquee, sometimes with a one-line description.
- 3CategoriesOptional groups such as CRM, Data or Communication.
- 4CountA number like "100+ integrations".
- 5Directory linkA button to the full integrations page.
Common integrations section variants
1. Icon grid
Rows of app icons in rounded squares.
2. Hub diagram
The product logo in the center with connected apps orbiting it.
3. Categorized cards
Integrations grouped under headings, each card naming the app and what it does.
4. Compact band
A heading, a line of copy and a button, with a small row of logos.
Spotted in our design reviews
Our reviews describe an integrations section on 60 of the 422 SaaS homepages in the catalog. A few of them:
"Plug in, not lock in" follows, with round integration icons scattered along faint orbital arcs and one "See integrations" link.
Grafana · Feature rows and integrations
The diagrams share one radial dial graphic, and the third sits on a flat mid-blue panel with integration icons orbiting it.
Getsphere · Logo wall and feature blocks
Section "[02] STACK" is titled "Built for modern web teams, whatever the stack" and shows eight integration icons labelled "SLACK", "CI/CD", "GITHUB", "EXPO", "VERCEL", "DISCORD", "API" and "WEBHOOK".
Tester · Skills, trusted logos and stack
Four rounded cards follow in the right two-thirds of the page: a chat-and-preview builder, an MCP diagram with a terminal, an "Import React code" drop zone and a cloud of integration icons.
Retool · Logos, app gallery and feature cards
A rounded near-black panel follows, with framed illustrations stacked in its right two thirds: a browser at "orbit.lovable.app", an integration grid, a wireframe globe and "SOC 2", "ISO" and "GDPR" badges.
Lovable · Feature cards and dark panel
A hexagon grid of integration icons sits under "Why Bond knows what matters."
Bondapp · Problem statements and task-card explainers
Cards pair a photo or a grid of integration icons with a bold lead-in such as "Get up and running fast." and "Sync across your tech stack."
Basewell · Platform cards and feature grid
The coverage section, headed "Visibility where sensitive content lives", shows twelve integration tiles in two rows of six, including "Salesforce", "Slack", "Jira", "Google Drive", "Snowflake" and "Box".
Metomic · Three-step process, integrations and FAQ
Often confused with
Integrations section vs. logo cloud
A logo cloud shows customers who use the product; an integrations section shows other products it connects to.
Integrations section vs. feature section
Integrations are a feature, but they get their own section because buyers look for them specifically.
Frequently asked
How many integrations should the homepage show?
Enough to cover the tools your buyers use most, often twelve to twenty icons, with the rest behind a link to the directory.
Should integrations be grouped?
Once you have more than about fifteen, yes. Categories let visitors check their own stack quickly.