Slack
Body copy at reading size.
- Headings
- Salesforce Avant Garde
- Body
- Salesforce Sans
- Free stand-in
- Poppins / Lato
- WCAG AA
- 8/9
- WCAG AAA
- 6/9
- Tech SEO
- 92
Slack leads with #730394 (fuchsia) set in Salesforce Avant Garde; Notion with #0075DE (blue) set in NotionInter. Controls are 4px versus 8px, and 8 of 9 versus 8 of 9 key color pairings pass WCAG 2.1 AA.
Body copy at reading size.
Body copy at reading size.
Measured values side by side. The last column is arithmetic on those values, not a judgment.
| Attribute | Slack | Notion | Difference |
|---|---|---|---|
| Primary color | #730394 · Fuchsia | #0075DE · Blue | Different hue, OKLab ΔE 24.8 |
| Text color | #1D1C1D | #191918 | OKLab ΔE 1.5 |
| Canvas | #FFFFFF · Neutral white | #FFFFFF · Neutral white | Identical |
| Mode | Light | Light | Same |
| Heading font | Salesforce Avant Garde (free stand-in Poppins) | NotionInter | Different families |
| Body font | Salesforce Sans (free stand-in Lato) | NotionInter | Different families |
| Control radius | 4px | 8px | Notion rounder by 4px |
| Card radius | 16px | 12px | Slack rounder by 4px |
| Radius style | Technical | Rounded | Different |
| WCAG 2.1 AA | 8 of 9 (89%) | 8 of 9 (89%) | Equal pass rate |
| WCAG 2.1 AAA | 6 of 9 (67%) | 4 of 9 (44%) | Slack higher by 23 pts |
| Button label contrast | 9.68:1 | 4.57:1 | Slack higher by 5.11 |
| Technical SEO | 92/100 | 100/100 | Notion higher by 8 |
| SEO checks passing | 12 of 14 | 14 of 14 | Notion passes 2 more |
| XML sitemap | 3,162 URLs | 278 URLs | Both found |
| Structured data | none | Organization, WebSite, SoftwareApplication | Only one publishes JSON-LD |
| Data from | 11 Nov 2026 | 10 Nov 2026 | Both reference snapshots |
| Pairing | Slack | Notion |
|---|---|---|
| Body text on surface | Aa16.99:1AA | Aa17.59:1AA |
| Secondary text on surface | Aa6.69:1AA | Aa6.53:1AA |
| Primary as link/text on surface | Aa9.68:1AA | Aa4.57:1AA |
| Button label on primary | Aa9.68:1AA | Aa4.57:1AA |
| Accent on surface | Aa2.02:1Fail | Aa3.88:1Large |
| Secondary on surface | Aa14.00:1AA | Aa13.18:1AA |
| White on secondary | Aa14.00:1AA | Aa13.18:1AA |
| Dark mode: text on canvas | Aa18.02:1AA | Aa17.77:1AA |
| Dark mode: primary on canvas | Aa4.54:1AA | Aa4.54:1AA |
Homepage checks from each dated scan. Sites that refuse automated requests show no score rather than an estimate.
Slack uses #730394 as primary, #4A154B as secondary and #36C5F0 as accent, with #1D1C1D text on #FFFFFF. Notion uses #0075DE as primary, #31302E as secondary and #2383E2 as accent, with #191918 text on #FFFFFF. Click any swatch on this page to copy its hex code.
Slack sets headings in Salesforce Avant Garde (free stand-in Poppins) and body text in Salesforce Sans (free stand-in Lato). Notion sets headings in NotionInter. Proprietary faces are previewed with the named free Google Fonts stand-in.
Slack uses 4px controls and 16px cards (technical geometry). Notion uses 8px controls and 12px cards (rounded geometry). Control radius: notion rounder by 4px.
Slack passes 8 of 9 key pairings at WCAG 2.1 AA (89%) and 6 at AAA. Notion passes 8 of 9 at AA (89%) and 4 at AAA. The pairings cover body text, links, buttons and dark mode.
Slack's homepage scores 92/100, with 12 of 14 checks passing. Notion's homepage scores 100/100, with 14 of 14 checks passing. Scores come from SuiteAnvil's 14 weighted technical checks (title, description, H1, canonical, Open Graph, structured data, sitemap, HTTPS and more) and are never estimated.
Enter your URL in the benchmark form on this page. SuiteAnvil scans your homepage, CSS and sitemap, then opens the same side-by-side view of your site against Notion, or against Slack.
Dated snapshots of each company's public website styling for educational and interoperability purposes. Brands evolve; values may change. Names and logos are trademarks of their owners, shown for identification only; SuiteAnvil is not affiliated with or endorsed by Slack or Notion.
SuiteAnvil extracts publicly visible design tokens, logos, and font references for workflow automation. You are responsible for ensuring you hold valid commercial rights or client authorization for any proprietary fonts, trademarks, and brand assets before commercial publication. Licensing notice