PDFNote Web - AI PDF & Page Markdown Notebook

/ 1
picture_as_pdf

No PDF Loaded

Click "Open PDF" or drop a PDF here to begin your interactive note session.

Help & User Guide

📖 Overview

PDFNote is a client-side web application designed to act as a synchronized PDF viewer and page-by-page Markdown notebook. Your text notes, drawings, and markups are automatically linked to their respective pages.

📂 Loading & Saving Documents

  • Open PDF: Loads a PDF file for viewing and drawing.
  • Open Bundle (.pdfmd / .zip): Restores a saved workspace. This loads the original PDF file, all of your page-by-page markdown notes, and drawing layers.
  • Link Folder: Connects to a local directory on your device using the File System Access API. Enabling this folder sync allows the app to automatically write {pdf_name}_notes.json, {pdf_name}_notes.md, and individual assets directly to your disk while you work.
  • Save: Exports your workspace as a .pdfmd zipped file containing notes, images, drawings, and the PDF.

🛠️ Toolbar Control Reference

  • picture_as_pdf Open PDF: Load a PDF file.
  • folder_open Open Bundle: Load a saved workspace package.
  • sync Link Folder: Sync directly to a local device folder.
  • save Save: Save notes, drawings, and PDF to a bundle package.
  • navigate_before / navigate_next Page Navigation: Turn pages (Keyboard Arrow keys Left/Right also navigate pages when not typing).
  • zoom_out / zoom_in Zoom Controls: Change zoom scale or select fitting behaviors.
  • arrow_selector_tool Cursor Tool: Standard selection tool. Use to edit annotations or highlight text.
  • border_color Highlight Tool: Highlight text content inside the PDF.
  • format_underlined Underline Tool: Underline text content inside the PDF.
  • gesture Draw Tool: Freehand drawing tool for canvas overlay annotations.
  • title Text Tool: Add floating text boxes directly on the PDF.
  • signature Signature Tool: Draw and place signature blocks on the page.
  • ink_eraser Eraser Tool: Eraser tool to wipe out drawing/text markups.

📝 Markdown Notebook Editor

  • Take markdown notes for the active page on the right workspace panel.
  • Toggle Edit/Read Mode: Toggle between Markdown notes editing and viewing modes using the floating action button (FAB) or the keyboard shortcut Ctrl + E (or Cmd + E on Mac).
  • Use format accelerators (Bold, Italic, Code block, List, Link, Image, Mermaid diagrams) in the markdown bar to quickly write rich notes.
  • Images and diagrams are click-to-expand. Clicking them inside notes view mode opens a full-screen blurred lightbox.

🔄 Auto-Save & Cache Recovery

  • Typing or drawing automatically saves data to an IndexedDB background cache every 3 seconds.
  • If a browser crash occurs, the app prompts you to restore your exact unsaved session when you reload.

About PDFNote

PDFNote Web

Created by Borish127

A synchronized PDF viewer and page-by-page Markdown notebook. Easily read, annotate, and take rich, structured notes dynamically linked to each page of your PDF documents.

code GitHub Repository

We invite you to give feedback, report bugs, or share suggestions!

Give feedback & suggestions