Skip to main content

A JupyterLab extension and nbconvert preprocessor/exporter for HTML export with cell style metadata overrides

Project description

Jupyter Export HTML Style

Test Documentation PyPI version Conda Version License: MIT DOI

A JupyterLab extension and nbconvert preprocessor/exporter that allows custom cell-level styling when exporting notebooks to HTML and PDF.

Features

  • ๐ŸŽจ Custom Cell Styling: Apply CSS styles to individual cells via metadata
  • ๐ŸŽฏ Input/Output Styling: Separate styles for cell inputs and outputs
  • ๐Ÿ“ Notebook-Level Styling: Add custom styles and stylesheets to the entire notebook
  • ๐Ÿ“ฆ Resource Embedding: Automatically embeds local CSS files as inline styles for self-contained HTML
  • ๐Ÿ–ผ๏ธ Image Embedding: Embeds images as base64 data URIs for self-contained HTML exports
  • ๐Ÿ”ง nbconvert Integration: Seamlessly integrates with nbconvert's export pipeline
  • ๐Ÿ“„ PDF Export with Styles: Export to PDF via HTML with all custom styles applied
  • ๐Ÿš€ Easy to Use: Simple metadata-based configuration

Installation

Using pip

pip install jupyter-export-html-style

Using conda

conda install -c phygbu jupyter-export-html-style

From source

git clone https://github.com/gb119/jupyter_export_html_style.git
cd jupyter_export_html_style
pip install -e .

Quick Start

1. Add Style Metadata to Cells

In your Jupyter notebook, add style metadata to cells:

{
  "metadata": {
    "style": {
      "background-color": "#f0f0f0",
      "border": "2px solid #333",
      "padding": "10px"
    }
  }
}

2. Export with Custom Styles

HTML Export

From the command line:

jupyter nbconvert --to styled_html notebook.ipynb

Or using Python:

from jupyter_export_html_style import StyledHTMLExporter

exporter = StyledHTMLExporter()
(body, resources) = exporter.from_filename('notebook.ipynb')

PDF Export (with Styles)

Export to PDF via HTML with all custom styles applied:

From the command line:

jupyter nbconvert --to styled_webpdf notebook.ipynb

Or using Python:

from jupyter_export_html_style import StyledWebPDFExporter

exporter = StyledWebPDFExporter()
(body, resources) = exporter.from_filename('notebook.ipynb')

Note: PDF export requires Playwright to be installed:

pip install nbconvert[webpdf]
playwright install chromium

JupyterLab Integration

In JupyterLab, the exporters are available in the File โ†’ Save and Export Notebook As... menu with user-friendly names:

  • HTML (with styles) - Export to HTML with custom cell and notebook styles
  • PDF via HTML (with styles) - Export to PDF via HTML with custom styles applied

These menu entries correspond to the styled_html and styled_webpdf exporters used in the command line examples above.

Usage Examples

Cell-Level Styling

Highlighting Important Cells

{
  "style": {
    "background-color": "#fff9c4",
    "border": "2px dashed #fbc02d"
  }
}

Error/Warning Styling

{
  "style": {
    "background-color": "#ffebee",
    "border-left": "5px solid #f44336"
  }
}

Custom CSS Strings

{
  "style": "background: linear-gradient(to right, #667eea 0%, #764ba2 100%); color: white; padding: 15px;"
}

Input and Output Styling

Style the input and output areas of cells separately:

Input Styling

{
  "input-style": {
    "background-color": "#f5f5f5",
    "border-left": "4px solid #2196f3",
    "padding": "10px"
  }
}

Output Styling

{
  "output-style": {
    "background-color": "#e8f5e9",
    "border": "1px solid #4caf50",
    "font-family": "monospace"
  }
}

Combined Cell, Input, and Output Styles

{
  "style": {
    "margin": "20px 0",
    "border-radius": "8px"
  },
  "input-style": {
    "background-color": "#fce4ec",
    "color": "#880e4f"
  },
  "output-style": {
    "background-color": "#e8f5e9",
    "font-family": "monospace"
  }
}

Notebook-Level Styling

Add custom styles and stylesheets that apply to the entire notebook. Add these to the notebook metadata (not cell metadata):

Note: Local or relative CSS file paths will be automatically embedded as inline styles in the exported HTML, creating self-contained files. Remote URLs (http:// or https://) will remain as external <link> tags.

Custom Inline Styles

{
  "metadata": {
    "style": ".jp-Cell { box-shadow: 0 2px 4px rgba(0,0,0,0.1); } body { font-family: Arial, sans-serif; }"
  }
}

External Stylesheets

Single stylesheet (local file):

{
  "metadata": {
    "stylesheet": "custom-theme.css"
  }
}

Single stylesheet (remote URL):

{
  "metadata": {
    "stylesheet": "https://example.com/custom-theme.css"
  }
}

Multiple stylesheets (mixed local and remote):

{
  "metadata": {
    "stylesheet": [
      "local-styles.css",
      "https://fonts.googleapis.com/css2?family=Roboto&display=swap",
      "https://example.com/custom-theme.css"
    ]
  }
}

Combined Notebook Styles

{
  "metadata": {
    "style": "body { max-width: 1200px; margin: 0 auto; }",
    "stylesheet": ["local-theme.css", "https://fonts.googleapis.com/css2?family=Inter&display=swap"]
  }
}

Building from Source

Building Python Wheels

pip install build
python -m build

The wheel and source distribution will be created in the dist/ directory.

Building Conda Packages

conda install conda-build
conda build conda.recipe

The conda package will be built in your conda-bld directory.

Documentation

Full documentation is available at https://gb119.github.io/jupyter_export_html_style/

Development

Setting Up Development Environment

# Clone the repository
git clone https://github.com/gb119/jupyter_export_html_style.git
cd jupyter_export_html_style

# Create virtual environment
python -m venv venv
source venv/bin/activate  # On Windows: venv\Scripts\activate

# Install in development mode
pip install -e ".[dev,docs]"

Running Tests

pytest

Code Quality

# Format code
black jupyter_export_html_style

# Lint code
ruff check jupyter_export_html_style

# Type check
mypy jupyter_export_html_style

Project Structure

jupyter_export_html_style/
โ”œโ”€โ”€ jupyter_export_html_style/    # Main Python package
โ”‚   โ”œโ”€โ”€ __init__.py              # Package initialization
โ”‚   โ”œโ”€โ”€ preprocessor.py          # nbconvert preprocessor
โ”‚   โ””โ”€โ”€ exporter.py              # Custom HTML exporter
โ”œโ”€โ”€ docs/                        # Documentation
โ”‚   โ”œโ”€โ”€ source/                  # Sphinx documentation source
โ”‚   โ”‚   โ”œโ”€โ”€ index.md
โ”‚   โ”‚   โ”œโ”€โ”€ installation.md
โ”‚   โ”‚   โ”œโ”€โ”€ usage.md
โ”‚   โ”‚   โ”œโ”€โ”€ api.md
โ”‚   โ”‚   โ””โ”€โ”€ contributing.md
โ”‚   โ”œโ”€โ”€ Makefile                # Documentation build (Unix)
โ”‚   โ””โ”€โ”€ make.bat                # Documentation build (Windows)
โ”œโ”€โ”€ conda.recipe/               # Conda build recipe
โ”‚   โ””โ”€โ”€ meta.yaml              # Conda package metadata
โ”œโ”€โ”€ .github/                   # GitHub configuration
โ”‚   โ””โ”€โ”€ workflows/            # CI/CD workflows
โ”‚       โ”œโ”€โ”€ build.yml         # Build and test workflow
โ”‚       โ””โ”€โ”€ docs.yml          # Documentation build workflow
โ”œโ”€โ”€ pyproject.toml            # Project metadata and build configuration
โ”œโ”€โ”€ README.md                 # This file
โ”œโ”€โ”€ LICENSE                   # MIT License
โ””โ”€โ”€ .gitignore               # Git ignore patterns

Contributing

Contributions are welcome! Please see CONTRIBUTING.md for details.

  1. Fork the repository
  2. Create a feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

Support

Citation

If you use this project in your research, please cite:

@software{jupyter_export_html_style,
  author = {Burnell, Gavin},
  title = {Jupyter Export HTML Style},
  year = {2026},
  url = {https://github.com/gb119/jupyter_export_html_style}
}

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

jupyter_export_html_style-0.0.5.tar.gz (38.5 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

jupyter_export_html_style-0.0.5-py3-none-any.whl (18.1 kB view details)

Uploaded Python 3

File details

Details for the file jupyter_export_html_style-0.0.5.tar.gz.

File metadata

File hashes

Hashes for jupyter_export_html_style-0.0.5.tar.gz
Algorithm Hash digest
SHA256 1d2ca433cc407dfa03d059a21e69d6f13fa4e2a98c5b9d68e26e900fec944a0f
MD5 e3bd7af9258fc676963fa3b2a8acf786
BLAKE2b-256 e50c900fc88b6f629850b5a23a1b9a59f46c2c6bf5b466e59f16bdfcab89c481

See more details on using hashes here.

File details

Details for the file jupyter_export_html_style-0.0.5-py3-none-any.whl.

File metadata

File hashes

Hashes for jupyter_export_html_style-0.0.5-py3-none-any.whl
Algorithm Hash digest
SHA256 803e6dd86cee3077409733b6026995e0c223894477da838eb298360aedcee1f7
MD5 044df71dc4882c51ec4646c27ba3f096
BLAKE2b-256 639b3df167dc4c7cc091e7354aeff671f5a201750fb5e9641206482dec95ad19

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page