ipyslides

Create Interactive Slides in Jupyter Notebook with all kind of rich content. https://asaboor-gh.github.io/ipyslides/

View the Project on GitHub asaboor-gh/ipyslides

IPySlides

DOI Binder PyPI version Downloads

IPySlides is a Python library for creating interactive presentations in Jupyter notebooks. It combines the power of Markdown, LaTeX, interactive widgets, and live variable updates in a single presentation framework.

Why IPySlides?

The Problem: Static PowerPoint vs. Superficial Notebook Relayouts

Scientists, engineers, and programmers are trapped between two frustrating extremes. PowerPoint forces you into a dead, non-interactive workflow of pasting static screenshots and endlessly duplicating slides just to reveal a single bullet, equation, or figure element. Conversely, traditional notebook-based presentation tools are nothing more than superficial cell wrappers; they simply relayout your raw notebook cells without providing any native content support, structural design, or layout control. This forces you to awkwardly chop your analysis into dozens of artificial cells just to trigger basic fragments. Moreover, their static exports often break, leaving you without a reliable backup if your live Python kernel is not available.

The Solution: An Interactive, Content-Aware Ecosystem

IPySlides embeds a frame-aware presentation engine directly into your computational workflow, letting you run your full analysis and build high-fidelity slides side-by-side in the same notebook.

By replacing copy-paste duplication and artificial cell chopping with programmatic framing, a single cell acts as a canonical source that natively understands structure, progressing in precise, incremental steps. It keeps execution code, rich outputs, and custom layouts perfectly synchronized while supporting active Jupyter widgets for real-time data manipulation. When it’s time to export, it generates a production-grade HTML or crisp PDF backup that accurately mirrors your presentation.

Features

Quick Start

Install:

pip install ipyslides        # Basic installation
pip install ipyslides[extra] # Full features

Create Slides:

import ipyslides as isd
slides = isd.Slides()

# Add content programmatically
with slides.slide(-1):
    slides.src("""
    # My First Slide
    - Point 1
    - Point 2
    $E = mc^2$
    """)

# Or use cell magic
%%slide 0 -m
# Title Slide
Welcome to IPySlides!

Run Examples:

isd.docs()  # View  and interact with documentation
isd.demo()  # See and interact with demo presentation

✨ Try it in your browser ✨

View Static Notebooks

Content Types

Support for various content types including:

import numpy as np
from ipywidgets import HTML

@slides.dl.interact(html = HTML(), amplitude= (0, 2),frequency=(0, 5))
def plot(html, amplitude, frequency):
    x = np.linspace(0, 2*np.pi, 100)
    y = amplitude * np.sin(frequency    * x)
    plt.plot(x, y)
    html.value = slides.plt2html(). value

import numpy as np
import matplotlib.pyplot as plt
from ipywidgets import HTML
from ipyslides.dashlab import Dashboard

dash = Dashboard(
    html = HTML(),
    amplitude = (0, 2),
    frequency = (0, 5),
)

@dash.callback
def plot(self, html, amplitude, frequency):
    x = np.linspace(0, 2*np.pi, 100)
    y = amplitude * np.sin(frequency * x)
    plt.plot(x, y)
    html.value = slides.plt2html().value # can be directly shown on out-main

@dash.callback('out-text')
def text(self, amplitude, frequency):
    print(f"Amplitude: {amplitude}\n Frequency: {frequency}")

dash.set_layout( 
    left_sidebar = ['*ctrl'], # all controls in left sidebar 
    center = ['html','out-.*'], # out-main, out-text collected in center
    pane_widths = [3,5,0]
)
dash.set_css(
    main = { # can also be set via post_init callback
        'grid-gap': '4px', 'margin': '8px',
        '.left-sidebar': {'background': '#eee','border-radius': '8px'},
    },
    center = { # can be set in main through '> .center' selector
        '> *': {'background-color': 'whitesmoke', 'border-radius': '8px','padding':'8px'},
        'grid-template-columns': '5fr 3fr', # side-by-side layout for outputs
        'grid-gap': '4px', # central grid gap
        '> *': {'background-color': 'whitesmoke', 'border-radius': '8px','padding':'8px'}
})
display(dash)

Dashboard Example See more examples in DashLab repository and try it out in

Export Options

See demo.pdf for an example exported PDF.

Advanced Features

Caveats

  1. Markdown Cells:
    • Jupyter markdown cells are not processed by IPySlides
    • Instead, you can use %%slide number -m cell magic and link an external markdown file using slides.sync_with_file
  2. Slide Numbering:
    • Use -1 for automatic slide numbering
    • Manual numbering requires careful tracking to avoid overwriting slides
  3. Speaker Notes:
    • Experimental feature - use with caution
    • Notes appear at top of slide in PDF to grab speaker’s attention and are meant for speaker reference only, e.g. printed handout.
    • Place extended projector on top/bottom of laptop screen while presenting in Jupyter Notebook to allow right/left edges click navigation work smoothly.

Development

git clone https://github.com/asaboor-gh/ipyslides.git
cd ipyslides
pip install -e .

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Documentation

Acknowledgements

Made with ❤️ by Abdul Saboor