# Notion, Product

SaaS · Product · Custom code · San Francisco, USA
Live page: https://www.notion.com/product/ai
On Designly: https://designly.sh/s/notion/product/ai · JSON: https://designly.sh/s/notion/product/ai?format=json
Site: [Notion](https://designly.sh/s/notion?format=md) (https://www.notion.com)
Styles: type-led, light, corporate, geometric

## Why it works

Large NotionInter headlines on a white background establish a clear hierarchy, while bright sky blue is used sparingly for primary actions like "Try for free". A grid of six interface previews and video elements follows the hero, providing immediate context for the tool's utility.

## Sections, top to bottom

1. [Navigation: "Navigation"](https://designly.sh/s/notion/product/ai#section-1) (y 0–64px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/0.webp · id sec_ee2408a31ad0434b8bcc318c37d3bbb8
2. [Hero: "Meet your 24/7 AI team"](https://designly.sh/s/notion/product/ai#section-2) (y 144–459px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/1.webp · id sec_170787e365ba480bb76695bdd76f27c8
3. [Logos: "Logos"](https://designly.sh/s/notion/product/ai#section-3) (y 507–571px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/2.webp · id sec_f0e83b2b09eb462f8811a64e38d8fd7c
4. [Gallery: "Gallery"](https://designly.sh/s/notion/product/ai#section-4) (y 619–1379px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/3.webp · id sec_6bbaa60ee9874309b1426d92c9c7b682
5. [Pricing table: "Pricing"](https://designly.sh/s/notion/product/ai#section-5) (y 1707–2696px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/4.webp · id sec_932ded51730544d8aa8155a53b6b16a7
6. [Content: "Custom Agents automate work that repeats"](https://designly.sh/s/notion/product/ai#section-6) (y 2696–3624px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/5.webp · id sec_fe13cf3501fc4683aabad704870a581d
7. [Content: "Your Notion Agent can build, edit, and take…"](https://designly.sh/s/notion/product/ai#section-7) (y 3920–4928px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/6.webp · id sec_091da1c9d9734db09b64bbd927d35062
8. [Content: "Enterprise Search finds answers across all your…"](https://designly.sh/s/notion/product/ai#section-8) (y 4928–5856px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/7.webp · id sec_362fdf27860d4844adae9f277d7fbb72
9. [Team: "Team"](https://designly.sh/s/notion/product/ai#section-9) (y 5857–6785px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/8.webp · id sec_6ce0a544e868413ebdc62fa1dac8e752
10. [Content: "Designed for teams"](https://designly.sh/s/notion/product/ai#section-10) (y 6785–7456px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/9.webp · id sec_f06c116753f34c66849a388399dc46e2
11. [Content: "Model agnostic"](https://designly.sh/s/notion/product/ai#section-11) (y 7480–8017px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/10.webp · id sec_97c3cb00ed1a42ae8c149d5ac6f564ca
12. [Logos: "Trusted by enterprise"](https://designly.sh/s/notion/product/ai#section-12) (y 8096–8918px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/11.webp · id sec_a21a3073198d4a439f20e2d680d871c6
13. [Content: "See what Notion AI can do"](https://designly.sh/s/notion/product/ai#section-13) (y 8918–9420px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/12.webp · id sec_7a791bb084a34ad4ba5c66e4e7f652da
14. [FAQ: "Questions & answers"](https://designly.sh/s/notion/product/ai#section-14) (y 9420–9866px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/13.webp · id sec_cd83718047da4f2c9b6b3eb70c97f120
15. [Footer: "Footer"](https://designly.sh/s/notion/product/ai#section-15) (y 9866–10274px of 10274) · image: https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/sections/14.webp · id sec_50d90e12550948348b49a7361ab8d47f

## Design tokens

- Colours: #FFFFFF (background), #000000 (text), #0075DE (accent), #E6F3FE (surface)
- Fonts: NotionInter (display)
- Corner radius: 12px
- Spacing: 80px
- Export: https://designly.sh/s/notion/product/ai?format=tokens.css · https://designly.sh/s/notion/product/ai?format=tokens.json · https://designly.sh/s/notion/product/ai?format=tokens.tailwind.css

## Images

- Desktop (1440×10274): https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/desktop.webp
- Mobile (390×8000): https://designly.sh/media/captures/cap_0fe603a940a3463080fbbcdb659ca8e1/mobile.webp
- Captured: 2026-10-24

## Other Pages of Notion

- [Home](https://designly.sh/s/notion?format=md) — /
- [About](https://designly.sh/s/notion/about?format=md) — /about
- [Careers](https://designly.sh/s/notion/careers?format=md) — /careers
- [Pricing](https://designly.sh/s/notion/pricing?format=md) — /pricing

## Related

- [Stripe, Product](https://designly.sh/s/stripe/payments?format=md) — Fintech · Product · Custom code · South San Francisco, USA · styles: developer-centric, corporate, dense, photo-led, minimal · image: https://designly.sh/media/captures/cap_7e84371876f44b14a6db93e1d857214c/desktop.webp
- [Cursor, Product](https://designly.sh/s/cursor/en-US?format=md) — AI products · Product · Custom code · San Francisco, USA · styles: type-led, minimal, corporate, light · image: https://designly.sh/media/captures/cap_d34c7f7d134143abab07949e3ae969fa/desktop.webp
- [Figma, Careers](https://designly.sh/s/figma/careers?format=md) — SaaS · Careers · Custom code · San Francisco, USA · styles: type-led, airy, colourful, corporate · image: https://designly.sh/media/captures/cap_e0b8aa76d25d45edac46e5dea63eb2e7/desktop.webp
- [Figma, Blog](https://designly.sh/s/figma/blog?format=md) — SaaS · Blog · Custom code · San Francisco, USA · styles: dark, type-led, geometric, editorial · image: https://designly.sh/media/captures/cap_da4ff442cbaa4634b9c0747a39979c9f/desktop.webp

Credit: every reference is a real business's site. If it shapes your work, link to the business and to its Designly page.