Enabling Dark Theme in Our JavaScript PDF Viewer

With PSPDFKit it’s possible to change the interface to dark mode programmatically or based on device information.

Launch Demo

The PSPDFKit.Configuration#theme property accepts one of three values:

• PSPDFKit.Theme.LIGHT

• PSPDFKit.Theme.DARK

• PSPDFKit.Theme.AUTO

The default value is PSPDFKit.Theme.LIGHT, which is the light theme.

You can set your preferred theme in the configuration object passed to PSPDFKit.load:

PSPDFKit.load({ theme: PSPDFKit.Theme.DARK });

PSPDFKit.Theme.AUTO will automatically choose the theme based on the user preferences and the prefers-color-scheme media query, which isn’t available in every browser. You can check the current browser support for the prefers-color-scheme media query here.