Skip to main content

Documentation

How to embed widgets

Copy a widget URL into Notion or use iframe code on other platforms. Customize with URL parameters.

Quick start
Get a widget running in Notion in under a minute.
  1. 1. Choose a widget

    Browse the gallery and open the Embed tab on any card.

  2. 2. Copy the URL
    https://notion-widgets.riyaj.in/widget/today-date
  3. 3. Embed in Notion

    Type /embed, paste the URL, press Enter.

URL parameters
Append query strings to customize widget behavior.
/widget/today-date?format=short&theme=auto
/widget/countdown?date=2026-12-31&variant=surface
/widget/pomodoro?work=30&break=10
theme=auto|light|dark
variant=transparent|surface
format, city, …

theme=auto follows your system and Notion dark mode. variant=surface adds a subtle card background when you want more separation from the page.

Sizing & aspect ratio
Each widget recommends width, height, and aspect ratio in the gallery Embed tab.

Copied iframe code uses fluid width (width:100% with a max-width), a minimum height, and aspect-ratio so blocks scale cleanly in Notion.

Adjust width and height in the Embed tab before copying. The preview updates to match.

Embed pages set viewport=device-width, initial-scale=1, maximum-scale=1 so widgets render at the correct scale inside Notion iframes on mobile and desktop.

API reference

GET /api/widgets

Returns all 100 widgets with metadata and embed paths.

GET /api/weather?city=London&unit=celsius

Live weather when OPENWEATHER_API_KEY is set.

Mobile embeds (Notion iOS & Android)
What we tested and how to get the best result on phones.
  • Notion mobile sometimes shows embeds as a link preview — configure on desktop, then open the page on mobile.
  • Use full-width embed blocks and at least the recommended height shown in the gallery.
  • Interactive widgets (lists, timers, forms) use scroll areas and 44px touch targets on small screens.
  • Add a plain link below the embed as fallback: same widget URL opens in the browser if the iframe is blank.
  • Widgets marked Mobile tested in the gallery were checked at 375px width and in Notion-style narrow iframes.
Security & performance
  • Served over HTTPS with validated URL parameters
  • No external tracking scripts in widget embeds
  • Per-widget code splitting — only the requested widget bundle loads in each embed