How to playing with media settings in Dusky Dark Mode?

Exclude Settings

Enable Exclude Elements

1. Description: Allows users to specify certain elements that should not be affected by dark mode.
2. Usage:
   • Enable this setting if you want to exclude specific elements from being modified by dark mode.
   • This is useful for maintaining the original appearance of logos, icons, or any other elements that should remain in their default style.

Exclude Elements

1. Description: Define the elements that should be excluded from dark mode adjustments.
2. Usage:
   • Specify the CSS selectors of the elements you want to exclude.
   • Example: .logo, .brand-icon to exclude elements with these classes.

Image Settings

Darken Background Images

1. Description: Automatically darken background images to match the dark mode aesthetic.
2. Usage:
   • Enable this setting to reduce the brightness of background images, making them easier on the eyes in dark mode.
   • Useful for ensuring that background images do not appear too bright compared to other elements.

Low Brightness Images

1. Description: Adjust the brightness of images to ensure they are not too glaring.
2. Usage:
   • Enable this setting to apply a low brightness filter to images.
   • Helps in maintaining a consistent visual experience across different images.

Grayscale Images

1. Description: Convert images to grayscale when dark mode is enabled.
2. Usage:
   • Enable this setting to desaturate images, making them grayscale.
   • This can help in reducing visual noise and focusing more on content.

Invert Images

1. Description: Invert the colors of images to better match the dark mode.
2. Usage:
   • Enable this setting to invert image colors.
   • Useful for images that look better or are more readable when inverted in dark mode.

Image Replacement

1. Description: Allows for replacing certain images with alternatives better suited for dark mode.
2. Usage:
   • Specify alternative images that should be used in dark mode.
   • This setting can be used to provide higher contrast or specially designed images for dark backgrounds.

How to Configure Media Settings in Dusky Dark Mode

1. Access the Settings:
   • Navigate to the Dusky Dark Mode settings panel in your application.
2. Exclude Settings:
   • Enable the Enable Exclude Elements option.
   • Define the elements you want to exclude by adding their CSS selectors to the Exclude Elements field.
3. Adjust Image Settings:
   • Enable Darken Background Images to automatically darken background images.
   • Enable Low Brightness Images to apply a low-brightness filter to all images.
   • Enable Grayscale Images to convert images to grayscale.
   • Enable Invert Images to invert the colors of images for better dark mode compatibility.
4. Set Up Image Replacement:
   • Specify alternative images that should be used in dark mode.
   • This can be done by defining image URLs or paths that correspond to the original images.

By configuring these settings, you can ensure that your application maintains a consistent and visually appealing dark mode experience, while also preserving the integrity of important media elements.