PDF Viewer with Dark Mode

A professional PDF viewer extension for Visual Studio Code with dark mode support, smart position memory, and powerful features.

✨ Features

Core Features

• 📄 Native PDF Viewing: Open and view PDF files directly in VS Code
• 🌙 Smart Dark Mode: Automatically follows your VS Code theme
• 💾 Position Memory: Remembers your reading position (page, scroll, zoom) for each PDF
• 🔍 Full-Text Search: Search across all pages with highlighted results
• ⚡ Lazy Loading: Fast loading even for large PDFs (300+ pages)

Professional Features (v2.0+)

• 📝 Text Selection & Copy: Select and copy text directly from PDF
• 📑 Table of Contents: Hierarchical TOC like Microsoft Edge (v2.1+)
• 🖼️ Page Thumbnails: Sidebar with previews of all pages
• 🔦 Search Highlighting: Visual highlights for search matches
• 📊 Reading Progress: Track your progress with smart statistics
• ⏱️ Time Estimation: Estimates reading time remaining

Navigation & Controls

• 📑 Smooth Navigation: Arrow keys, page numbers, or scroll to navigate
• 🔎 Multi-Level Zoom: 50% to 200% with presets (Fit Page, Fit Width)
• ↺ PDF Rotation: Rotate pages left or right
• ⛶ Fullscreen Mode: Distraction-free reading experience
• 🎯 Floating Page Indicator: Shows current page while scrolling
• 🗂️ Thumbnail Navigation: Quick jump to any page via sidebar

User Experience

• 🎨 Modern UI: Clean, professional interface with smooth animations
• ⌨️ Keyboard Shortcuts: Navigate and control without touching the mouse
• 🖱️ Tooltips: Helpful hints on every button
• 📱 Responsive Design: Works perfectly at any zoom level
• 🎭 Custom Scrollbar: Beautiful scrollbar design matching the theme

Cài đặt

Cài đặt từ source code:

1. Clone hoặc tải source code về
2. Mở thư mục trong terminal
3. Chạy lệnh cài đặt dependencies:

npm install

4. Mở thư mục trong VS Code
5. Nhấn F5 để chạy extension trong Development Mode

Đóng gói extension:

# Cài đặt vsce (VS Code Extension Manager)
npm install -g @vscode/vsce

# Đóng gói extension
vsce package

# File .vsix sẽ được tạo ra, cài đặt bằng cách:
# VS Code -> Extensions -> ... menu -> Install from VSIX

🚀 Usage

Opening PDFs

1. Open any .pdf file in VS Code
2. The extension will automatically launch the PDF viewer
3. Your last reading position will be restored automatically

Basic Controls

Navigation:

• Use Previous/Next buttons or arrow keys
• Enter a page number directly in the input box
• Scroll through the document naturally

Zoom:

• Click +/- buttons or use keyboard shortcuts
• Select from dropdown: 50%, 75%, 100%, 125%, 150%, 200%
• Choose Fit Page or Fit Width for automatic sizing

Theme:

• Click the 🌙/☀️ button to toggle dark/light mode
• Dark mode automatically inverts PDF colors for comfortable reading

Advanced Features

🔍 Full-Text Search:

• Click the 🔍 button or press Ctrl+F
• Type your search query (minimum 2 characters)
• Browse results with Previous/Next buttons
• Click any result to jump to that page

↺ Rotation:

• Click ↺ to rotate left (counter-clockwise)
• Click ↻ to rotate right (clockwise)
• Great for viewing documents in different orientations

⛶ Fullscreen:

• Click the ⛶ button or press F11
• Enjoy distraction-free reading
• Press F11 again or Esc to exit

💾 Position Memory: The extension automatically saves for each PDF:

• Current page number
• Scroll position
• Zoom level
• Saves after 1 second of inactivity

⌨️ Keyboard Shortcuts

Make reading faster with these shortcuts:

Navigation

Zoom

Tools

Commands

Open Command Palette (Ctrl+Shift+P or Cmd+Shift+P) and search:

• PDF Viewer: Toggle Dark Mode - Switch between dark and light themes
• PDF Viewer: Search in Document - Open the search panel
• PDF Viewer: Clear Position History - Clear all saved reading positions

⚙️ Settings

Open Settings (Ctrl+, or Cmd+,) and search for "PDF Viewer":

Example Configuration

{
  "pdfViewer.darkMode": true,
  "pdfViewer.rememberPosition": true,
  "pdfViewer.defaultZoom": 1.25
}

💻 Requirements

• Visual Studio Code version 1.70.0 or higher
• No additional dependencies required (all bundled in the extension)

🛠️ Technology Stack

• PDF.js - Mozilla's PDF rendering library
• VS Code Extension API - Custom editor provider
• IntersectionObserver - Lazy loading optimization
• Webview API - Sandboxed PDF display

📝 Notes

• Read-only viewer - This extension is for viewing PDFs, not editing
• Automatic theme detection - Dark mode follows your VS Code theme
• Lazy rendering - Only visible pages are rendered for better performance
• Text selection - Full text layer support for copy/paste
• Smart progress tracking - Tracks pages visited and estimates reading time
• High-quality print - 2x resolution for crisp printing
• Secure - PDFs are rendered in a sandboxed webview environment
• Privacy - All processing happens locally, no data sent to external servers

🚧 Known Limitations

• Text selection and copying not yet supported
• Annotations and form filling not available
• Some complex PDF features may not render perfectly

🔮 Roadmap

✅ Completed (v2.0.0)

• [x] Text selection and copy to clipboard
• [x] Page thumbnails sidebar
• [x] Print functionality
• [x] Search result highlighting
• [x] Reading progress tracker

🚧 Planned for future releases

• [ ] PDF annotations (highlight, notes, drawings)
• [ ] PDF outline/table of contents viewer
• [ ] Two-page spread view
• [ ] Export selected pages to new PDF
• [ ] Text-to-speech for accessibility
• [ ] Form filling support
• [ ] Digital signature viewing

🤝 Contributing

Contributions are welcome! Feel free to:

• Report bugs by creating an issue
• Suggest new features
• Submit pull requests
• Improve documentation

📄 License

MIT License - Free to use and modify

Copyright (c) 2026 PDF Viewer with Dark Mode Extension

🙏 Acknowledgments

• PDF.js team at Mozilla for the excellent PDF rendering library
• VS Code team for the powerful extension API
• All contributors and users who provide feedback

📮 Support

If you encounter any issues or have questions:

1. Check the Known Limitations section
2. Search existing issues on GitHub
3. Create a new issue with detailed information

Enjoy reading PDFs in VS Code! ⭐ If you find this extension useful, please consider giving it a star on GitHub!