BLOG // June 30, 2021
Solve blurry scaled images in Chrome
A very annoying new "feature" in Chrome in the last couple of months is that CSS scaled images (e.g. max-width or width limits on larger images) are blurry when loaded. You can fix this by adding this style tag to your images:
style="image-rendering: -webkit-optimize-contrast;"
Below is what an image looks like without the tag:
And here is the version with the style tag above:
Comments
Subscribe to new articles
If you enjoy my content, consider subscribing. You will only receive new blog stories, no other email.