Retina Macbook Pro blurring pixels

[sophkins]

Hi!
I recently switched from an iMac to Macbook Pro and I'm loving it!
The only problem is the retina display, everything looks good, except pixel art...

I'm a pixel artist and every time I upload my pictures they appear as blurry, I have confirmed that this isn't an issue caused by the hosting site, as the art looks very good on my ipad and other pc, it also looks sharp and how it's supposed to in preview.

Does retina cause this problem or safari itself? Any clue on how to fix it?
I tried to play with the resolution but that wasn't any help either.

 

[ZakL]

It's normal on a 'retina' screen, the problem is every pixel from your image is infact being displayed on 4 screen pixels, so some interpolation/aliasing has to take place. On pixel art this will be very noticeable.

The workaround for images is to create an image 4 times as large (2x width, 2x height) and then scale it down in the browser:

http://jsfiddle.net/AD79e/

In the example above both images are rendered at 400x400px, but the right hand side image is infact 800x800px so will be significantly crisper on a retina display. On a normal display they will both look the same.