Instant setup
Include our prebuilt UMD build or install from npm. You can render a presentation in just a few lines of code.
PptxViewJS unpacks .pptx files on the client, draws slides with Canvas, and gives you the controls you need for embedding presentations, learning content, and product demos.
Built for modern product tours, LMS platforms, and documentation portals. Bring native PowerPoint fidelity to any web application and stay in control of the UX.
Drop a single script tag, load from npm, or bundle with your frontend build. PptxViewJS handles decompression, slide parsing, rendering, and interaction so you can focus on the experience.
Include our prebuilt UMD build or install from npm. You can render a presentation in just a few lines of code.
Canvas-based rendering keeps text crisp and layouts pixel-perfect. Optional Chart.js support keeps data visuals intact.
Use the included toolbar or build your own navigation, thumbnails, or analytics around the core viewer component.
Runs fully client-side in modern browsers. Works inside frameworks like React, Vue, Svelte, and even embedded inside Streamlit.
Load JSZip and the PptxViewJS bundle. Add Chart.js if your slides contain charts.
Create a container element, then call PptxViewJS.render with a file input, URL, or ArrayBuffer.
Hook into events for slide changes, progress updates, and errors. Configure toolbars, thumbnails, and keyboard shortcuts.
Copy and paste this snippet to try PptxViewJS in any static HTML page.
<!-- Optional: Chart.js (required only for PPTX charts) -->
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
<!-- Required: JSZip dependency -->
<script src="https://cdn.jsdelivr.net/npm/jszip@3.10.1/dist/jszip.min.js"></script>
<!-- PptxViewJS UMD bundle exposes global `PptxViewJS` -->
<script src="https://cdn.jsdelivr.net/npm/pptxviewjs/dist/PptxViewJS.min.js"></script>
<div id="viewer" style="width:960px;height:540px;margin:auto"></div>
<script>
const viewer = new PptxViewJS.Viewer('#viewer');
viewer.load('https://example.com/decks/intro.pptx');
</script>See PptxViewJS embedded in different layouts and frameworks.
Upload a .pptx file and step through slides with basic controls.
Open simple.html →Toolbar controls, zoom, fullscreen, thumbnail navigation, and URL loading.
Open full.html →Side-by-side thumbnails and viewer for knowledge bases or documentation.
Open embedded.html →Render decks inside a Streamlit dashboard using a custom HTML component.
View streamlit_app.py →Work with the gptsci team to tailor PptxViewJS for your platform. We can help with secure hosting, slide analytics, and integrations with your existing data stack.
Talk to us