How can I fix a blurry header image on my Craft Theme website?

Store Design
, ,
1

I need help with my Craft Theme website.

For our logo in the header we want to use an image with our logo on it. On this image there is a lady and as you can see on our site www.noalynn.org this image is blurry while the original file used for the image has a resolution of 3000x600 and is as sharp as can be.

If anyone knows how to fix this either by working around this or by fixing a mistake I’ve made I would really appreciate the help!!

Greetings Team NOA LYNN®

2

Hi,

Save your image as SVG and upload this will make it look excellent

3

Thanks for the advice but when i convert it to svg the whole image changes into a collection of colored shapes (the vector shapes) but this does not give the desired result.

It really is a photo with a logo on top of it but it’s blurry after uploading it to the header.

4

Hey @NoaLynn ,

As per your websites HTML, the images for this logo are (for different sizes), but none of these images is full size 3000X600 (as you mentioned above). You should probably upload correct full scale photo to fix this.

Thanks

Yash Garg

5

I’ve tried it multiple times and changed the original file size a couple of times. The original is really sharp and when i upload it to the “Logo image” input it shows the preview as sharp as it’s supposed to be but when it comes on to the site it’s blurry. I think there is a bottleneck at the “Logo image” part of the site where it converts it to the size set for the “Logo image” by the developers but I can’t find a way around this or where to find the issue in the code.