In-browser PDF viewing, annotations, forms, signatures, and redaction. 37 samples spanning every major UI surface.
Wire up @nutrient-sdk/viewer-mcp — an MCP server that gives AI assistants live access to Web SDK docs, API, examples, and changelog. Add it to your MCP client config:
{
"mcpServers": {
"Nutrient": { "command": "npx", "args": ["@nutrient-sdk/viewer-mcp"] }
}
}Prefer agent skills? Follow the Web SDK agent skill guide to install Nutrient skills directly into your coding agent.
Why a document renders with the wrong type, and how customFonts fixes it — the same document rendered without its fonts and with them, side by side
Role-based annotation permissions with a teacher/student classroom model — toggle visibility per student
Customize default properties for annotation tools including colors, sizes, fonts, and line styles with live preview
Save and restore annotation states locally with version control-like functionality for managing document changes
Browse the document's table of contents and bookmarks in a custom sidebar with click-to-navigate
Bidirectional slider to brighten dark or poorly-scanned documents, or enable night mode for comfortable dark reading
Threaded comment replies with author tracking, @mentions, and configurable display modes (Fitting, Floating, Popover)
Advanced content editing with text detection, find & replace, and AI text generation
Click anywhere on a document to place numbered markers using custom-rendered annotations with a sidebar tracker
Measure distances on a construction floor plan by dropping two pins. The measurement line and its live distance label update as you drag either pin.
Extract and compare full document text across page boundaries with visual diff highlighting and change navigation
A completely custom menu interface with custom toolbar, annotation tools, document comparison, and measurement capabilities
Creative custom annotation renderers showcasing visual effects, animations, interactive widgets, and more
Build custom form builder UI by hiding SDK defaults and replacing with your own components
Assemble documents by dragging pages between two panels with multi-select, reorder, rotate, duplicate, delete, upload, and export
Demonstrate all supported document loading methods: URL, ArrayBuffer, Blob, and Base64. Includes file upload with method selection
View Word documents with tracked changes and comments in different markup modes: no markup, original, simple markup, and all markup
Search through PDF documents with context-aware results, instant highlighting, and automatic navigation to matches
The same document search, but every match is highlighted with a CustomOverlayItem instead of a HighlightAnnotation — nothing is written to the document and teardown is one call per overlay
Programmatically populate PDF form fields from JSON data presets with editable field values and apply/clear controls
Drag and drop form fields onto PDF documents with an intuitive form creator mode for building interactive forms
Client-side validation rules with visual feedback on PDF form fields using a declarative rule engine
Drag and drop grouped form fields with image backgrounds, company logos, checkboxes, signatures, and date fields. Moving or deleting any element affects the entire group.
Search a corpus of mixed PDFs and Office documents using a prebuilt full-text index, then jump straight to the matching page in the viewer with the term highlighted
Same cross-document search, but with the index in Postgres and queries served by an API route. Demonstrates the production path beyond a static JSON dump
Automatically search and highlight configurable keywords in a document with color-coded annotations
Toggle PDF layer groups (OCGs) to show or hide building systems on a construction floor plan with quick presets
Cross-document navigation through link annotations — a contract and its exhibits, where every citation is a clickable link that swaps the document in the same viewer
View multiple PDF documents in a tabbed interface with page position memory, closeable tabs, and file upload
Toggle night mode in the PDF viewer with a custom toolbar button using CSS filter inversion
Bluebeam/Procore-style numbered bubble + leader arrows for construction punch lists, with a live legend sidebar
Add a visible, clickable link in a single guided action — one button prompts for text, color, and URL, then one click creates the text label and link annotation together
Digital patient check-in with smart form pre-population, progressive form completion, and HIPAA-compliant data handling
Permanently redact sensitive information using preset PII patterns (SSN, credit card, email, phone), custom text terms, or regular expressions
Complete signature workflow with drag-and-drop field placement, electronic signatures, role-based permissions, signature flattening, and a visible digital signature on an appended certificate page via DWS API
Custom sidebar, comment badges, and interactive slot actions — demonstrating the Nutrient Web SDK slot UI customization API
Side-by-side PDF comparison with synchronized viewing and interactive change tracking
Compare a document pair visually (overlay) and textually at once, with auto-highlighted changes and reviewer markup on both views
Single-view comparison where each text change is a custom-overlay callout pinned to its location, showing the before → after value
Extract text from PDF pages with current-page or full-document view, copy to clipboard, and download as plain text
Add configurable text watermarks to every page with customizable text, font size, color, opacity, and rotation
Display the current zoom level as a percentage in a custom toolbar button with click-to-reset functionality