Dark mode
Intelligent color scheme detection that always matches your app — never mismatched, never surprising.
- Last reviewed
Dark mode
Dark mode in getuserfeedback.com is designed to be intelligent. The widget always matches your app's color scheme — automatically.
How it works
The widget detects your app's current mode by watching for standard signals:
a dark class or data-theme="dark" attribute on <html> or <body>. This
is how most apps and frameworks (Tailwind, Next.js, etc.) signal dark mode.
The key behaviors:
- If your app doesn't have dark mode, the widget will never turn it on. It stays in light mode.
- If your app does have dark mode, the widget follows along automatically as your users toggle it.
- The widget never mismatches your app. If your app is in light mode, the widget is in light mode. Always.
Light mode is the default — the widget is light unless a dark mode signal is present.
Hosted survey pages
Survey pages on getuserfeedback.com enable dark mode automatically based on the visitor's system preferences and let them toggle it manually.
Fallback behavior
When a value isn't provided in dark mode, it's inherited from light mode. You only need to set the colors that should actually change.
Overriding the default
If you need to force a specific color scheme instead of auto-detecting:
// At startup
const client = createClient({
apiKey: "YOUR_API_KEY",
colorScheme: "dark",
});
// Or at runtime
client.configure({ colorScheme: "system" });
Each get-started guide covers the setup for your integration:
- React SDK —
colorSchemein client options orconfigure() - JavaScript SDK —
colorSchemeincreateClient()orconfigure() - Google Tag Manager — in the tag settings
- Iframe — path-based color scheme in
the URL (
/dark,/light,/system)
Learn more
- Look & feel — brand colors and visual control
- Blog: Dark mode — the original announcement with more background