[GH-ISSUE #23393] Notes: PDF export has black background (dark theme) and loses Markdown formatting #35497

New Issue

GiteaMirror · 2026-04-25T09:42:45-05:00

GiteaMirror commented

2026-04-25 09:42:45 -05:00

Originally created by @zacharyshupp on GitHub (Apr 3, 2026).
Original GitHub issue: https://github.com/open-webui/open-webui/issues/23393

Describe the Bug

When downloading a Note as PDF Document (via the note's Download menu), the generated PDF has two distinct problems:

Black background — The PDF inherits the dark theme's CSS background color instead of rendering with a white/print-safe background. Switching to a light theme removes the black background, but does not fix issue #2.
Markdown formatting not applied — The PDF does not reflect the rich-text formatting of the note. Bullet lists, numbered lists, bold text, and heading hierarchy are all lost. The content appears as partially-rendered plain text with only some inline bold applied.

Steps to Reproduce

Open a Note that contains Markdown formatting (e.g., headings, bullet lists, numbered lists, bold text).
Click the download button inside the note editor.
Select PDF Document.
Open the downloaded PDF.

Expected: PDF renders with a white background and preserves all Markdown formatting (headings, lists, bold, etc.) as displayed in the note editor.

Actual: PDF renders with a black background (when using dark theme) and the formatting is stripped — bullet/numbered lists appear as plain lines, heading structure is lost.

Screenshots

Note as displayed in OpenWebUI

The note renders correctly in the editor with bullet lists, numbered steps, bold text, and section headings.

Resulting PDF output

The PDF has a black background and all list/heading formatting is lost.

Environment

Browser: Google Chrome (latest) and Microsoft Edge (latest) — reproduced in both
Theme: Dark theme triggers the black background; light theme removes it but formatting loss persists
Feature: Notes → Download → PDF Document

Additional Context

The black background appears to be caused by the PDF renderer capturing the dark theme's CSS background-color without a print stylesheet override.
The formatting loss suggests the PDF is being generated from raw/partially-processed Markdown rather than from the rendered HTML that the editor displays.
A @media print CSS rule setting background: white; color: black on the note container, combined with ensuring the fully-rendered HTML (not raw Markdown) is used as the PDF source, should address both issues.

Originally created by @zacharyshupp on GitHub (Apr 3, 2026). Original GitHub issue: https://github.com/open-webui/open-webui/issues/23393 ## Describe the Bug When downloading a Note as **PDF Document** (via the note's Download menu), the generated PDF has two distinct problems: 1. **Black background** — The PDF inherits the dark theme's CSS background color instead of rendering with a white/print-safe background. Switching to a light theme removes the black background, but does not fix issue #2. 2. **Markdown formatting not applied** — The PDF does not reflect the rich-text formatting of the note. Bullet lists, numbered lists, bold text, and heading hierarchy are all lost. The content appears as partially-rendered plain text with only some inline bold applied. ## Steps to Reproduce 1. Open a Note that contains Markdown formatting (e.g., headings, bullet lists, numbered lists, bold text). 2. Click the download button inside the note editor. 3. Select **PDF Document**. 4. Open the downloaded PDF. **Expected:** PDF renders with a white background and preserves all Markdown formatting (headings, lists, bold, etc.) as displayed in the note editor. **Actual:** PDF renders with a black background (when using dark theme) and the formatting is stripped — bullet/numbered lists appear as plain lines, heading structure is lost. ## Screenshots ### Note as displayed in OpenWebUI The note renders correctly in the editor with bullet lists, numbered steps, bold text, and section headings. <img width="1176" height="668" alt="Image" src="https://github.com/user-attachments/assets/ad294534-6556-46d6-b227-1050d97bc4a0" /> ### Resulting PDF output The PDF has a black background and all list/heading formatting is lost. <img width="1265" height="944" alt="Image" src="https://github.com/user-attachments/assets/e378d015-f497-452a-9b53-04270fe31ab4" /> ## Environment - **Browser:** Google Chrome (latest) and Microsoft Edge (latest) — reproduced in both - **Theme:** Dark theme triggers the black background; light theme removes it but formatting loss persists - **Feature:** Notes → Download → PDF Document ## Additional Context - The black background appears to be caused by the PDF renderer capturing the dark theme's CSS `background-color` without a print stylesheet override. - The formatting loss suggests the PDF is being generated from raw/partially-processed Markdown rather than from the rendered HTML that the editor displays. - A `@media print` CSS rule setting `background: white; color: black` on the note container, combined with ensuring the fully-rendered HTML (not raw Markdown) is used as the PDF source, should address both issues.

GiteaMirror added the bug label 2026-04-25 09:42:45 -05:00

GiteaMirror closed this issue

2026-04-25 09:42:46 -05:00

GiteaMirror commented

2026-04-25 09:42:47 -05:00

@Classic298 commented on GitHub (Apr 3, 2026):

CC @ShirasawaSama i think you tackle this?

@Classic298 commented on GitHub (Apr 3, 2026): CC @ShirasawaSama i think you tackle this?

GiteaMirror commented

2026-04-25 09:42:47 -05:00

@Classic298 commented on GitHub (Apr 3, 2026):

https://github.com/open-webui/open-webui/pull/21364