A user encountered issues while attempting to convert collection images from square to circular in the Dawn theme. After applying custom code found on the forum, the images became circular but retained an unwanted grey square background. Removing the code left the grey background and distorted images.
Code location uncertain (suspected in base.liquid)
Only wanted the first collection to be circular, but both were affected
Multiple solutions were proposed:
Use Dawn’s built-in settings for round images via the collections grid (screenshot provided)
Add custom CSS markup above the </body> tag in theme.liquid
Modify the color scheme settings, as the grey comes from color-scheme-2
Resolution:
The issue was resolved by either creating a new color scheme with transparent/white background or changing the existing color scheme’s background color for that section. The user confirmed the solution worked successfully.
Summarized with AI on November 8.
AI used: claude-sonnet-4-5-20250929.
I was trying to make my collection images circle from square and looked up the coding to do it in dawn theme from this forum. I put the coding in and it made the images circle but there is still a grey square behind it. when i tried to erase the code, the grey was still there and images were still circle. I dont know where the code is coming from. now, its definitely in the base.liquid. Can someone please help me?
Also, I would like the images circle but only the first collection. It has made both collections circle images.
Hello @fayely , You are using the Dawn theme, It provides a default setting to make images in a round shape with the help of settings in the collections grid. Please see the screenshot below.
Hello @fayely , This section takes the color schema property from color-scheme-2 and that schema has that gray color so you have to change that color from that schema, or else you make a new schema with bg of transparent or white for this and assign it to that section.
