WebViewer: How to get current Theme mode?

Product: WebViewer

Product Version: 8.12.0

Is there any function/api that get the current theme (light mode or dark mode) of the viewer?

Hi Mcsmiley,

Thank you for contacting us regaring Webviewer.

To get the current them, you can use the following code snippet:


This will return ‘light’ or ‘dark’.

Please let us know if this resolve your issue, thank you.

1 Like

I got Property 'selectors' does not exist on type 'typeof UI' error.

Hi Mcsmiley,

Can you share how you invoke this method in your code?

I was able to get the them using the method on our demo: https://showcase.apryse.com/.

Thanks for showing me that it can be done in the demo.
My code is written in Typescript.

import { Core, UI, WebViewerInstance } from '@pdftron/webviewer';
function getThemeMode(instance: WebViewerInstance) {


error TS2339: Property 'selectors' does not exist on type 'typeof UI'.

I believe that your solution is correct and is what I am looking for. I probably have a problem with setting up PDFTron for TypeScript somehow :man_shrugging:


I wonder what is selectors ? :face_with_diagonal_mouth:
I cannot find both selectors and getActiveTheme() in the documentation.

I do find getActiveTheme() in the webviewer-ui.min.js though.

Ps. I also cannot do

const theme = instance.UI.Theme;
// Property 'Theme' does not exist on type 'typeof UI'.


but has no problem using it as a type:

const foo: UI.Theme;

Alright, I got a workaround.

(instance?.UI as any).selectors.getActiveTheme()

is a way to go.

Sadly that I cannot find other types that works including type of UI and object.

Hi Mcsmiley,

Thank you for letting us know.

Our typescript comes from the JSDoc, not building the UI natively in Typescript, so I think that’s why the issue exists. Currently, it seems we don’t have exposed API on this, I’ll raise the question to the team.

1 Like