Remove collection background (dawn theme)

Shopify Discussion

Topic summary

A user seeks help removing a gray background from product images with transparent backgrounds in their Shopify Dawn theme collection.

Solutions Provided:
Two contributors offered CSS code snippets to make card backgrounds transparent:

  • Target .card .card__inner .card__media with background-color: transparent !important;
  • Alternative targeting .card-wrapper.product-card-wrapper .card--media .card__inner

Both solutions involve adding custom CSS through the theme customizer or Featured Collection settings.

Follow-up Issues:

  • The original poster questioned why transparent backgrounds display incorrectly
  • One responder explained this occurs due to default theme styling applied to empty spaces
  • A separate user asked how to apply similar changes to the Spotlight Featured Collection section background (not individual cards) on their homepage

Status: The initial issue has proposed solutions, but the discussion remains open with unanswered questions about the root cause and extending the fix to other theme sections.

Summarized with AI on November 10. AI used: claude-sonnet-4-5-20250929.
1

hi can someone help me remove the gray background on my black tshirt with a transparent background

https://retrolinksgolf.com/

2

Hi @thanksagain

please put the below CSS code into your theme customizer of the collection and hit save

.card .card__inner .card__media .media {
    background-color: #fff !important;
}

2024-02-02 10_21_57-.png
2024-02-02 10_21_57-.png1340×607 57 KB

Thanks

3

@thanksagain Please paste below code in the customize mode.

.card-wrapper.product-card-wrapper .card--media .card__inner {
    background-color: transparent !important;
}

  1. Go to “Online Store → Customize”.

  2. Go to “Featured collection” and paste the code in the “Custom CSS” field.

priyavinsinfo_0-1707317655975.png
priyavinsinfo_0-1707317655975.png347×577 20.9 KB

Please let us know whether it is useful to you.

4

hello. are you aware why this happens when the photo has a transparent background?

5

@thanksagain

It is because there is an empty style applied by the theme default.

Thanks

6

How would this be done for the Spotlight - Featured Collection background? Not the cards, but the collection section that is on my home page.

https://www.constitutionalcoffeeco.com/?_ab=0&_fd=0&_sc=1

password: lagloy