Introduction
As IBM QRadar continues to evolve into a more unified and modern platform, UI consistency has become a key expectation—especially for customers who rely on themes such as dark/light mode for usability and accessibility.
One important enhancement introduced in the QRadar App Framework is the ability for applications to inherit the user-selected global theme directly from the QRadar platform. This capability represents a meaningful improvement in both user experience and platform consistency across the QRadar ecosystem.
This feature will be available from QRadar Update Package 12 (UP-12) Release onwards.
Understanding Global/User-Selected Themes in QRadar
Before exploring how applications inherit themes, it’s important to understand where and how users choose theme.
Users can personalize their QRadar experience by navigating to:
- User Profile icon (top-right corner of the QRadar UI)
- User Preferences
- Preferences -> Theme (for example, Light or Dark)
Once saved, this theme becomes the user-selected global theme and is applied consistently across the QRadar interface. From IBM QRadar Update Package 12 (UP-12) Release onward, this preference is also propagated automatically to applications.
The Challenge: Why Consistent UI Theming Matters
Before the introduction of global theme inheritance, QRadar did not provide a standardized or unified approach for UI theming across applications. Each application implemented its own theming logic, often following different guidelines and processes. This fragmentation created several critical challenges:
Inconsistent User Experience
Applications appeared visually disconnected from the core QRadar interface, creating a jarring experience as users navigated between the platform and its applications. This lack of visual cohesion undermined the perception of QRadar as a unified security platform.
Higher Development and Maintenance Effort
Development teams had to design, implement, and maintain custom theming solutions independently for each application. This duplicated effort across teams, increased time-to-market, and created technical debt that required ongoing maintenance.
Poor Scalability Across the Ecosystem
As more applications were introduced to the QRadar ecosystem, enforcing consistency became increasingly difficult. Without a centralized theming mechanism, each new application risked introducing further visual inconsistency.
From a business perspective, this fragmentation increased operational costs, reduced platform cohesion, and negatively impacted user satisfaction—particularly for users who depended on accessibility-focused themes such as dark mode.
How Global Theme Inheritance Transforms User Experience
To address these challenges, IBM introduced user-selected global theme inheritance starting with QRadar Update Package 12 (UP-12) Release. This enhancement fundamentally changes how applications handle theming by shifting from a decentralized to a centralized approach.
With this enhancement, QRadar automatically passes the user's selected UI theme to applications when they are launched. This ensures that applications can adapt their appearance to match the platform's look and feel—without requiring custom or duplicated theming logic.
Each application can now adopt and apply this theme, ensuring:
- Visual consistency across the platform – Applications seamlessly match the QRadar interface
- Reduced development complexity – No need to build custom theming solutions
- Better long-term maintainability – Centralized theme management reduces technical debt
How Theme Inheritance Works
The implementation of global theme inheritance is elegantly simple yet powerful. When an application is launched or accessed from the QRadar Dashboard, QRadar automatically appends theme-related query parameters to the first URL loaded by the app.
Where This Feature Is Supported
Global theme inheritance works seamlessly in the following scenarios:
- Applications launched from the QRadar user interface – Standard application access from the main dashboard
- Applications accessed via QRadar Admin page – Available from QRadar Update Package 13 (UP-13) Release onward, providing theme consistency in administrative contexts
- Apps built using QRadar App Framework supported base image – Full support for modern application development
This ensures consistent behavior regardless of how or where the app is accessed, providing a unified experience across all entry points.
Implementing Theme Inheritance in Your Application
One of the most significant advantages of global theme inheritance is its simplicity. No additional configuration is required in the manifest.json. Theme inheritance works automatically once the application is launched.
Step 1: Read Theme Parameters from the URL
Your application needs to parse the URL query parameters to extract the theme information:
Sample Example:
// Parse URL parameters
const urlParams = new URLSearchParams(window.location.search);
const theme = urlParams.get('theme'); // Returns 'dark', 'light', etc.
const ui = urlParams.get('ui'); // Returns 'new', etc.
// Store theme preference
if (theme) {
localStorage.setItem('qradar-theme', theme);
}
Step 2: Apply Theme-Specific Styling
Once you've extracted the theme parameter, apply the appropriate styling to your application:
Sample Example:
// Apply theme to document
function applyTheme(theme) {
if (theme === 'dark') {
//apply appropriate styling to your application.
} else {
//apply appropriate styling to your application. }
}
// Apply theme on load
const currentTheme = urlParams.get('theme') ||
localStorage.getItem('qradar-theme') ||
'light';
applyTheme(currentTheme);
Step 3: CSS Implementation Example
Define theme-specific styles in your CSS:
Sample Example:
/* Light theme (default) */
body.light-theme {
// Define Styling for CSS
}
/* Dark theme */
body.dark-theme {
// Define Styling for CSS }
/* Apply CSS variables */
body {
// Define Styling for CSS
}
Business Value Delivered with Global Theme Inheritance
The introduction of global theme inheritance in QRadar Update Package 12 (UP-12) release delivers measurable business and technical benefits that extend across the entire QRadar ecosystem:
Optimized Development Process
- Eliminates redundant theming implementations – Development teams no longer need to build custom theming solutions for each application
- Reduces development and QA effort – Centralized theming means less code to write, test, and maintain
- Accelerates application delivery – Teams can focus on core functionality rather than UI consistency concerns
Simplified Theme Management
- Centralized theme control – Platform administrators manage themes in one place
- Automatic adaptation by applications – Applications inherit themes without manual intervention
- Reduced risk of UI regressions – Standardized approach minimizes theme-related bugs
Cohesive Design Across the Platform
- Consistent look and feel – Users experience a unified interface across all QRadar components
- Improved usability and accessibility – Dark mode and other accessibility themes work consistently
- Stronger platform trust and adoption – Professional, cohesive design increases user confidence
Final Thoughts
While global theme inheritance may appear to be a UI enhancement, its impact extends far beyond visuals. By standardizing theme behavior across applications, QRadar improves developer efficiency, platform scalability, and user experience.
This feature represents IBM's commitment to creating a more unified, accessible, and developer-friendly security platform. For development teams, it eliminates unnecessary complexity and allows them to focus on delivering value through innovative security capabilities. For end users, it provides a consistent, professional experience that adapts to their accessibility needs and preferences.
As QRadar continues to evolve, features like global theme inheritance demonstrate how thoughtful platform design can simultaneously reduce technical debt, improve user satisfaction, and accelerate the delivery of new capabilities across the ecosystem.
________________________________________________________________________________________________________________________________________________________________
About the Author: This blog post explores the technical implementation and business value of global theme inheritance feature, introduced in QRadar 7.5.0 Update Package 12 onwards.
Written by: Nishant Padhiyar (@Nishant Padhiyar)
Reviewed by: Parth Shah (@Parth Shah)
Related Resources:
For any queries, feel free to reach out to us at nishant.padhiyar@ibm.com or Parth.Anilbhai@ibm.com