Productivity App Website Integrations Section Examples

15 real integrations sections from 13 productivity app websites

There are 15 integrations sections here, cut from 13 live productivity app websites such as Raycast, Sunsama and Dropbox. 17% of the productivity sites in the library have a integrations section, higher than the 4% across all websites. 85% of them are light-themed and the most common headline fonts are Inter (3), Sharp Grotesk and Charlie Text.

At a glance

Live verified metrics

Integrations sections: 15
Sites: 13 of 78 productivity sites (17%)
Library-wide: 4% of all websites have one
Per site: 1.2 on average
Light / dark: 85% light · 15% dark
Top heading fonts: Inter (3), Sharp Grotesk and Charlie Text
Accent colours: neutral 4orange 3blue 3
Leading sites: Raycast, Sunsama and Dropbox

What makes a good integrations section on a productivity app website

Integration sections show where the product fits: a grid of familiar logos, grouped by category, with a link to the full directory. Productivity apps show the product working — real screenshots, keyboard shortcuts and integrations front and centre. Compare these examples with integrations sections from every industry, or see the full homepages on the productivity app website templates page.

What these 15 integrations sections have in common

On average each one carries 22.2 images or icons, 1.9 buttons and 6.7 links. 20% sit on a dark background, and 40% are taller than half their width — most are compact bands rather than full screens. Headlines range from “Create your first workflow with Microsoft Teams” (Jotform).

7 integrations sections worth studying

Raycast — “There’s an extension for that.”: Use your favorite tools without even opening them. Productivity Engineering Design Writing Linear Create, search and modify your issues without leaving your keyboard. Google Translate Use… (2 buttons, 56 images, background #07080a).
Sunsama — “Connects with all of your key product tools”: Github Asana Todoist Trello Jira Notion ClickUp Google Calendar Google Mail Outlook Calendar Outlook Email Linear Microsoft Teams Monday.com View Integrations (1 buttons, 14 images, background #ffffff).
Dropbox — “Google Gemini”: Pair Dropbox with Gemini chat and Gemini Spark to build on your ideas and move them forward—all while keeping access and approvals in place. Connect now… (3 buttons, 9 images, background #1e1919).
Trello — “Featured Power-Ups”: Outlook MailTracker by Kryl Solutions Add Seamlessly integrate email into Trello cards, boosting productivity and organization. 5,000+ Statuses & Workflow Add 🧞‍♂️ Manage statuses and workflow… (9 buttons, 18 images, background #ffffff).
Fantastical — “See Everything. Miss Nothing.”: , Exchange, iCloud, Todoist, CalDAV, and more. (0 buttons, 4 images, background #f7f7f7).
Harvest — “Everything connects, so your business runs more smoothly”: Set rates by person, project, or task type. Harvest picks the right one automatically. See which projects earn and get alerted before it’s too late. Set… (0 buttons, 5 images, background #ffffff).
Fillout — “Integrate with all your apps”: Get more done with the tools you already use. (0 buttons, 0 images, background #fbfbfb).

How to use these integrations references

See how integrations are grouped and whether the section links to a full directory; lead with the tools your buyers already use. For a productivity app, look at how each site shows the real product in use rather than abstract illustrations. Start with Raycast, Sunsama and Dropbox, click a section to open it at full size and copy its build prompt, palette and fonts.