๐ Core Dark Mode Features
- Frontend Dark Mode โ Instantly enable dark mode across your WordPress site with one click โ no coding required.
- Default Dark Mode โ Start your site in dark mode by default for all visitors while still letting them switch to light mode.
- OS-Aware Dark Mode โ Automatically match each visitorโs operating system theme for a seamless, personalized experience.
- Keyboard Shortcut Toggle โ Users can press Ctrl + Alt + D (Windows) or Control + Option + D (macOS) to switch modes instantly.
- Time-Based Auto Dark Mode โ Automatically switch to dark mode based on the userโs local time for a day-to-night experience.
- Admin Panel Dark Mode โ Reduce eye strain with a beautifully styled dark interface in the WordPress dashboard.
๐ Advanced Controls
- Hide Dark Mode Switch on Mobile โ Decide how and where the toggle appears on mobile devices.
- Show Switch in Menu โ Add the dark mode toggle directly to your main navigation.
- Shortcode for Menus โ Place the toggle anywhere inside menus with an easy shortcode.
- Disallowed Pages โ Keep selected backend pages in light mode for full control over your workspace.
๐จ Switch Customization
- Switch Toggler Designs โ Choose from 12 beautifully designed togglers to fit your siteโs aesthetic.
- Switch Background & Size โ Customize background color, width, and height for a perfect fit.
- Switch Border Controls โ Fine-tune border width, color, and radius for a polished finish.
- Switch Icon Color & Size โ Adjust icon colors and size separately for light and dark modes.
- Switch Positioning โ Choose from four default screen positions: bottom right, bottom left, top right, or top left.
- Margin Control โ Set precise margins from the selected position for a refined layout.
- Different Switch Position on Mobile โ Use separate positioning for mobile devices.
- Absolute or Fixed Position โ Make the switch scroll with the page or keep it fixed.
- Draggable Position โ Allow users to drag and reposition the switch anywhere.
- Switcher Shortcode โ Embed a fully customizable dark mode switch anywhere on your site.
- Alternative Dark Mode Switch โ Turn any existing button or element into a dark mode toggle using CSS selectors.
๐ฌ Tooltips & Guidance
- Floating Switch Tooltips โ Add helpful messages or fun text to your floating switch.
- Flexible Tooltip Positioning โ Place tooltips on the left, right, top, or bottom.
- Custom Tooltip Text โ Write your own messages to match your brandโs tone.
- Branded Tooltip Styling โ Set background and text colors for consistent branding.
๐จ Color Customization
- Pre-Designed Presets โ Instantly apply a professionally crafted dark mode palette (5 free / 11 Pro).
- Custom Background Colors โ Define primary and secondary backgrounds to match your brand.
- Text Color Control โ Adjust body, link, and hover colors for maximum readability.
- Input Field Styling โ Customize input backgrounds, text, and placeholders.
- Border Color Management โ Fine-tune border colors across your site.
- Button Color Customization โ Match button backgrounds and text colors to your theme.
- Scrollbar Dark Mode โ Apply dark styling to scrollbars for a unified appearance.
- Scrollbar Track & Thumb Colors โ Precisely style both track and thumb for branded scrollbars.
๐ผ Image Handling
- Low Brightness Images โ Reduce image brightness in dark mode for comfortable viewing.
- Adjustable Brightness Levels โ Fine-tune brightness from 0% to 100%.
- Exclude Specific Images โ Leave selected images untouched by brightness controls.
- Grayscale Images โ Apply a grayscale filter to images for a sleek look.
- Adjustable Grayscale Levels โ Set grayscale intensity to match your style.
- Invert Inline SVG โ Automatically invert inline SVG graphics.
- Invert Specific Images โ Target and invert only certain images.
- Replace Images in Dark Mode โ Upload alternate image versions for dark mode.
๐ฅ Video Handling
- Low Brightness Videos โ Reduce glare on embedded videos in dark mode.
- Adjustable Brightness Levels โ Control video brightness from 0% to 100%.
- Grayscale Videos โ Convert videos to grayscale for a distraction-free look.
- Adjustable Grayscale Levels โ Balance aesthetics and readability for each video.
- Replace Videos in Dark Mode โ Swap videos with dark-mode-specific versions.
- Flexible Video Sources โ Works with local files and external platforms like YouTube, Vimeo, and Dailymotion.
โ๏ธ Advanced Targeting
- Allow Only Elements โ Apply dark mode only to selected tags, classes, or IDs.
- Force to Correct Allowed Elements โ Ensure chosen elements always display properly.
- Disallowed Elements โ Exclude specific elements from dark mode styling.
- Force to Correct Disallowed Elements โ Override conflicting styles for readability.
- Allow Only Pages โ Restrict dark mode to selected pages.
- Disallowed Pages โ Exclude pages where dark mode isnโt appropriate.
- Allow Only Posts โ Enable dark mode on chosen posts.
- Disallowed Posts โ Prevent dark mode on posts needing unique visuals.
๐ Custom CSS & Developer Tools
- Dark Mode CSS โ Add custom CSS rules that apply only in dark mode.
- Child Element Styling โ Automatically apply styles to nested elements.
- Smart Selector Handling โ Use advanced selectors and filters for precise control.
- Normal Mode CSS โ Define global styles for both dark and light modes.
๐ Import / Export & Cleanup
- Import / Export Settings โ Transfer your dark mode configurations between sites easily.
- Download Backup Files โ Save and restore all custom settings and switch styles.
- Clean Up on Deletion โ Automatically remove stored settings when uninstalling to keep your database clean.