How to make your images in Markdown on GitHub adjust for dark mode and light mode

GitHub Markdown supports dynamic image switching for dark and light mode using the <picture> element, enhancing the visual appeal of README files across different user color schemes. By defining multiple image sources with the <source> media attribute, developers can ensure that images blend seamlessly with either theme, improving project presentation. The <picture> tag allows browsers to load specific images based on the user's color scheme preference: dark mode images for dark themes and light mode images for light themes, with a fallback <img> tag for unsupported scenarios. This approach can be used in any Markdown files rendered on GitHub, contributing to a more polished and adaptable appearance. Cassidy Williams, GitHub's senior director for developer advocacy, shares this technique, along with a demo link, to help developers implement it effectively.