Documentation
How to embed widgets
Copy a widget URL into Notion or use iframe code on other platforms. Customize with URL parameters.
- 1. Choose a widget
Browse the gallery and open the Embed tab on any card.
- 2. Copy the URL
https://notion-widgets.riyaj.in/widget/today-date - 3. Embed in Notion
Type
/embed, paste the URL, press Enter.
/widget/today-date?format=short&theme=auto
/widget/countdown?date=2026-12-31&variant=surface
/widget/pomodoro?work=30&break=10theme=auto follows your system and Notion dark mode. variant=surface adds a subtle card background when you want more separation from the page.
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.
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.
- 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.
- 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