Playground
Try every option of the viewer live, on bundled samples, your own URL or a local file, and watch its events.
What this shows
Every switch in the options panel maps to one prop, so you can see the effect of a feature before you read its page:
- Loading bundled samples, a URL or a local file: Document sources and Authenticated requests.
- Controlled page, scale and rotation with the imperative API buttons: Controlled state and Imperative API.
- Toolbar position, the compact breakpoint and the responsive “More actions” menu (drag the container width): Toolbar.
- Native, overlay and controlled fullscreen: Fullscreen.
- Fit modes, zoom presets, zoom reset and Ctrl/⌘ + wheel zoom: Fit modes and Zoom.
- Continuous layout and thumbnails: Continuous layout and Thumbnails.
- Text layer, links and search: Text layer, Links and Search.
- Page number input and the password prompt: Page number input and Password protection.
- Keyboard shortcuts and print modes: Keyboard shortcuts and Print.
- Dark and custom themes and Hungarian labels: Theming and Labels and locale.
- The event log records
onPageChange,onScaleChange,onDocumentLoad,onPageRenderandonError: Events.
Source
The playground is a regular React component built on the public API: apps/site/src/islands/Playground.tsx.
Try it with your own data
Paste any CORS-enabled PDF URL into the URL tab, or drop a PDF anywhere on the page. Local files never leave your browser.