How can i change the size of product picture only on frontpage?

Store Design
, , , ,

Topic summary

A user wants to reduce product image sizes on their store’s front page and add 10-pixel rounded corners, similar to a reference image they provided.

Two solutions were offered:

  1. GTLOfficial’s approach: Modify component-card.css at line 44, replacing .card__inner { width: 100%; } with .card__inner { width: 80%; } to reduce image container width.

  2. Sweans’ approach: Add CSS targeting .card--card .card__inner .card__media with border-radius: 10px for rounded corners, plus adjustable width (85%) and height (75%) properties.

Both solutions involve editing the theme’s CSS files (Dawn theme version 15.0.0). The user can customize dimensions to match their design needs. The discussion appears resolved with working solutions provided.

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

Hi,

i want the product picture on the frong page smaller with 10 pixel corners like here:

123.png
123.png825×433 272 KB

url: https://ba571d-cc.myshopify.com/

dawn theme 15.0.0

Thank you

2

Hello @store095

Go to online store ----> themes ----> actions ----> edit code ---->assets ---->component-card.css ----> line number 44
search this code

.card__inner {
width: 100%;
}

and replace with this code.

.card__inner {
width: 80%;
}

result

16.png
16.png365×452 135 KB

If this was helpful, hit the like button and accept the solution.
Thanks

2 Likes
3

Hi @store095 ,

To change the size of the product picture only on the front page, you can use the following CSS code:

.card--card .card__inner .card__media {
    border-radius: 10px;
    /* width  height adjustments */
    width: 85%; 
    height: 75%;
}

This code will adjust the product image size and add a border radius to make the corners rounded.

You can customize the width and height to fit your design needs. Just add this code to your theme’s CSS file.

I hope this helps! If it does, please like it and mark it as a solution!

If you need further assistance, feel free to reach out!

Regards,

Sweans

1 Like