That's right, CSS inside HTML 😁

At first, it might throw you off that we are writing CSS media queries inside HTML, but it is a necessity for this setup to work properly. Think about it 🤔 the browser has to choose an image to render, even before any CSS is loaded into the page!

This element is not limited to just dimension based media queries, but rather any media query! So you could do things like

💭 Different images for different orientaations

💭 Different image if user prefers high contrast

💭 Different images for different color schemes (light, dark)

The possibilities are endless 🚀