Dark Mode Support

Supported in:

Match the onscreen keyboard and other native interface elements to the iPad’s Display & Brightness Appearance setting for Light Mode or Dark Mode. This allows you to coordinate these elements with your content or switch them automatically at night for a customized appearance.

If the iPad is running iPadOS 13 or later with Dark Mode enabled (under iOS/iPadOS Settings > Display & Brightness > Appearance), Kiosk Pro will automatically use the dark appearance for the onscreen keyboard in the presentation view.

In addition to the keyboard, native interface elements like JavaScript alerts and context menus (when text selection is enabled) will match the system dark mode setting in the presentation view.

The app can't automatically change your kiosk's web content appearance, but you can use CSS styling rules to apply different styles based on whether the device is in light or dark mode to customize your content.

Kiosk Pro supports the prefers-color-scheme media query to detect the current appearance setting. For example, you could specify a dark background and light text when dark mode is active using:

@media (prefers-color-scheme: dark) {
   body {
      background-color: black;
      color: white;
   }
}<br>

See sample code below. This can be combined with Custom CSS Styling & Zoom Level Settings to inject dark mode-specific styling rules into an existing page.