Website Banner for Desktop Showing Blurred on Dawn Theme

Store Design
,

Topic summary

Desktop banner image quality degrades after adding code to show a different mobile image on Shopify’s Dawn theme. The uploaded desktop banner appears low resolution compared to the original, suggesting something in the code may be downscaling it.

Attempts: Multiple image sizes (larger, smaller, and exact resolution) were tried with no improvement. The issue persists regardless of upload size.

Observations: Text on the planner in the banner becomes blurred on larger desktop screens, while mobile and smaller browser windows look fine. A website link was provided for review.

Clarifications/requests: Another participant asked for the expected resolution and shared a screenshot to confirm appearance. The original poster seeks help identifying what in the theme/code is reducing the image resolution.

Context: Dawn is a Shopify theme; banners are responsive and may use different image sizes based on viewport.

Assets: A screenshot attachment and the live site link are central to understanding the visual quality issue.

Status: No fix or code changes confirmed yet; discussion remains open with unresolved cause and solution.

Summarized with AI on December 24. AI used: gpt-5.
1

I implemented some code for the dawn theme to show a different image for mobile.

Since adding this I’ve been having issues where the desktop banner is a low resolution.

I’ve tried following other articles and code but nothing seems to work.

It’s like it’s applying a smaller resolution to the image than the one uploaded. I’ve tried uploading multiple different image sizes, larger and smaller and the exact resolution but it always reduces it.

I think there must be something in the code shrinking it but I can’t work out what it is.

Could anyone help?

This is the website: https://www.papersmiths.co.uk/

2

I don’t know what is your expected resolution here, so how do you feel about image below? Is it you’re expecting?

VIEKIN_0-1721233132391.png
VIEKIN_0-1721233132391.png2866×1274 543 KB

3

The text / writing on the planner is going blurred when uploaded. Whereas on the original image it looks crisp and high res. Top one is the uploaded version. It seems to be fine for mobile and smaller browser windows, but when i open it on a larger desktop screen it doesn’t look good enough quality.