PacketViewer supports light and dark themes. Theme selection affects the overall
interface styling while preserving packet color schemes for consistency with
Wireshark profiles.
Light Mode (Default)
Dark Mode
PacketViewer v1.15.0 introduces dark mode support for the main PacketViewer
component.
Enabling DarkMode
Note: Dark mode support is currently limited to the main PacketViewer
component. Other Analysis Views and individual components do not yet support
dark mode theming.
To enable dark mode, set the data-theme attribute on the document element:
// Enable dark mode
document.documentElement.setAttribute("data-theme", "dark");
// Return to light mode
document.documentElement.setAttribute("data-theme", "light");
// or
document.documentElement.removeAttribute("data-theme");
Profile Colors
Dark mode preserves the packet color scheme defined by Wireshark profiles to
maintain consistency with familiar analysis workflows. Instead of replacing
these colors entirely, the interface dims them appropriately for dark
backgrounds while keeping the visual distinctions between different packet types
intact.