A free, private, browser-based PDF editor — edit existing text, draw, manage pages, add covers,
merge PDFs and export to PDF or Word (DOCX).
Everything runs locally in your browser. Your files are never uploaded to any server.
- The Edit text tool outlines every line and paragraph on the page. Click one and type.
- The original font (e.g. Calibri Bold, Times), size, colour, alignment, line spacing and background colour are detected and matched automatically.
- Edited text stays searchable and copyable in the exported PDF.
- Pen, highlighter pen, rectangle, ellipse, line and arrow, with colour, fill and line-width controls
- New text boxes, whiteout, area highlight, images and signatures
- Select / move / resize / delete objects, with per-page undo & redo
- Thumbnails with drag-and-drop reordering
- Rotate, duplicate and delete pages
- Add blank pages, pages from other PDFs, or images as pages
- 5 templates: Full photo, Classic, Modern band, Minimal, Bold colour
- Title, subtitle, author, date, colours, font and logo
- Use an uploaded photo as the full-page cover (with or without text). The page can match the photo's shape so nothing is cropped.
- The cover stays fully editable after inserting it
Combine any number of PDFs in the order you choose. Download the result directly, open it in the editor, or append it to the current document.
| Format | Details |
|---|---|
| Original content stays vector; edits and drawings are flattened on top at 216 dpi, with an invisible text layer for search/copy | |
| Word – Keep exact layout | Every page becomes a picture in Word, so it looks identical |
| Word – Editable text | Text (including your edits) extracted into normal Word paragraphs |
Optional page range, e.g. 1-3, 5.
Requirements: Node.js 18 or newer.
git clone https://github.com/SahansilvaDev/PDFeditor.git
cd PDFeditor
npm install
npm run devOpen http://localhost:5173 in your browser.
| Command | Description |
|---|---|
npm run dev |
Start the development server |
npm run build |
Type-check and build for production into dist/ |
npm run preview |
Serve the production build locally |
The production build in dist/ is a static site. It can be hosted on GitHub Pages, Netlify, Vercel or any web server.
Every push to main is built and published to GitHub Pages automatically by .github/workflows/deploy.yml.
| Key | Action |
|---|---|
Ctrl + Z / Ctrl + Y |
Undo / redo (per page) |
Delete |
Delete selected objects |
Esc |
Finish editing / back to the select tool |
PgUp / PgDn |
Previous / next page |
Ctrl + mouse wheel |
Zoom |
Tips:
- Drag and drop PDF or image files anywhere on the window to open or add them.
- Click the PDF Studio logo to go back to the home screen. You are asked to confirm first.
| Library | Used for |
|---|---|
| React + Vite + TypeScript | App |
| pdf.js | Rendering pages and reading text / fonts |
| Fabric.js | Editing and drawing layer |
| pdf-lib | Writing, merging and rotating PDFs |
| docx | Word export |
| Zustand | State management |
| Lucide | Icons |
src/
├── App.tsx app shell, dialogs, drag & drop
├── components/
│ ├── Home.tsx home screen
│ ├── Editor.tsx page canvas (pdf.js render + Fabric.js layer), in-place text editing
│ ├── Toolbar.tsx tools and style controls
│ ├── Sidebar.tsx page thumbnails and page operations
│ ├── CoverDialog.tsx cover page designer
│ ├── MergeDialog.tsx merge PDFs
│ └── ExportDialog.tsx PDF / Word export
└── lib/
├── store.ts document state (files, pages, page operations)
├── text.ts text extraction, paragraph grouping, font detection
├── exportPdf.ts PDF export and merging
├── exportDocx.ts Word export
├── cover.ts cover templates
└── overlay.ts edit-layer helpers (render, rotate, text runs)
- Edit text covers the original text (using the sampled background colour) and places the new text on top. The original text is still inside the PDF file, so search/copy may find both the old and the new text. Do not use it to remove confidential information; that needs true redaction.
- The original font is used only if it is installed on your computer. Otherwise a similar font (Arial / Times New Roman / Courier New) is used.
- On photos or gradient backgrounds, the area behind edited text becomes a flat colour.
- Edits are flattened as an image in the exported PDF. The invisible search/copy text layer supports Latin characters.
- Word Editable text export simplifies formatting. Scanned PDFs (images only) contain no text to extract.
Developed by Sahan Silva.