react-pdf-highlighter-plus

Interface PdfHighlighterTheme

Theme configuration for PdfHighlighter styling. Controls the appearance of the PDF viewer including dark mode support.

interface PdfHighlighterTheme {
    containerBackgroundColor?: string;
    darkModeColors?: {
        background: string;
        foreground: string;
    };
    darkModeInvertIntensity?: number;
    mode?: "light" | "dark";
    scrollbarThumbColor?: string;
    scrollbarTrackColor?: string;
}

Properties

containerBackgroundColor? darkModeColors? darkModeInvertIntensity? mode? scrollbarThumbColor? scrollbarTrackColor?

Properties

Optional containerBackgroundColor

containerBackgroundColor?: string

Background color of the viewer container.

Default

"#e5e5e5" for light mode, "#1e1e1e" for dark mode

Optional darkModeColors

darkModeColors?: {
    background: string;
    foreground: string;
}

Dark-mode recolor palette. White paper maps to background and black text/line-art to foreground, recolored per-color at draw time (OKLab ramp) so hues are preserved and embedded photos keep their pixels. Only used when mode === "dark".

Type declaration

  • background: string

    Replaces the white paper background.

  • foreground: string

    Replaces black text and line art.

Default

{ background: "#141210", foreground: "#eae6e0" }

Optional darkModeInvertIntensity

darkModeInvertIntensity?: number

Inversion intensity for dark mode (0-1). Lower values create softer dark backgrounds that are easier on the eyes.

  • 1.0 = Pure black background (harsh)
  • 0.9 = Dark gray ~#1a1a1a (recommended)
  • 0.85 = Softer gray ~#262626 (very comfortable)
  • 0.8 = Medium gray ~#333333 (maximum softness)

Default

0.9

Deprecated

Dark mode now recolors at draw time (OKLab, hue-preserving, photos untouched) instead of a CSS invert() filter. This value is ignored. Use PdfHighlighterTheme.darkModeColors instead.

Optional mode

mode?: "light" | "dark"

Theme mode. In dark mode, pages are recolored at draw time (hue-preserving, photos kept) using PdfHighlighterTheme.darkModeColors.

Default

"light"

Optional scrollbarThumbColor

scrollbarThumbColor?: string

Scrollbar thumb color.

Default

"#9f9f9f" for light mode, "#6b6b6b" for dark mode

Optional scrollbarTrackColor

scrollbarTrackColor?: string

Scrollbar track color.

Default

"#d1d1d1" for light mode, "#2c2c2c" for dark mode