Custom CSS Support for Markdown Preview in File Explorer Add-On

[somethingSTRANGE]

Description of the new feature / enhancement

Please provide a means to inject a custom stylesheet into the markdown preview that can be used system wide for all previewed markdown files.

This will allow users to override and augment the layout and appearance of previews with personalized and in some cases more accessible styles.

In PowerToys Settings > File Explorer add-ons, the Scalable Vector Graphics and Source code files (Monaco) previewers have options that allow for some preview customization, however the Markdown previewer does not. Please consider adding a text box option that allows the user to define a custom stylesheet. The previewer could then use the contents of that text box as the body of a <style> block which can be injected into markdown file previews.

Users can already define custom styles on a per-file basis by including such a <style> block in each markdown file. That's not a scalable solution, though. We need the ability to set a custom stylesheet once and allow it to be used by all markdown files previewed using the PowerToys previewer.

Scenario when this would be used?

Whenever markdown files are previewed.

Accessibility Enhancements: Custom stylesheets can be tailored to improve accessibility for users with specific needs, such as adjusting font sizes, colors, and contrast to better suit visually impaired users. This ensures that markdown documents are inclusive and accessible to a wider audience. Benefits include:

• Improved Readability: Custom stylesheets allow you to adjust font sizes, line heights, and spacing to make the text more readable for users with visual impairments. For instance, increasing font size can be crucial for users with low vision.

• Color Contrast: Ensuring sufficient color contrast is vital for readability, especially for users with color blindness or other visual challenges. Custom stylesheets enable you to choose color schemes that meet accessibility guidelines, making content more accessible to a broader audience.

Enhanced Productivity: By applying custom stylesheets, users can streamline their workflow by instantly seeing their markdown content rendered in their preferred style, reducing the need to manually format documents for different outputs. For example, using Visual Studio Code allows for such customizations, enhancing the markdown editing experience, but requiring users to open markdown documents in tools such as Visual Studio Code to to view them defeats the point of the preview. The preview pane in Windows Explorer is a great way to browse and view documents without having to open them in a 3rd party tool.

Supporting information

• Custom Markdown Preview Styles - Foam

Just ask Bing "benefits of customizing markdown previews with stylesheets" and you'll get the following response:

Customizing Markdown previews with stylesheets in VSCode has the following benefits:

Improved readability: You can choose themes that highlight syntax.
Customization: You can create unique styles for your files.
Enhanced visual appeal: Styling Markdown documents with CSS makes your content more visually appealing.