Make the product vendor text bigger on collection page for DAWN THEME

[NewYorkais]

Hello! 

I am using the new Dawn theme. Is there a way I can change the vendor text size to match the size of the product title and price on the collection page? I know there is a way to change the text size for product title & price on the collection page, but somehow the vendor text stays the same size. Currently, since I cannot change the vendor text size, I shrunk the product title & price size the same as the vendor to keep it consistent (see screenshot below) which is very small to see.

It is slightly inconvenient since our customers are giving us feedback that it is hard to see the vendor name on desktop (mobile looks okay, but would like the option to make it bigger as well on mobile). 

Lastly, the vendor name is always a lighter color than the product tile and price: is there any way to make all text the same color?

I look forward to any response! Thank you in advance!

[PaulNewton]

---

@NewYorkais wrote:

Is there a way I can change the vendor text size to match the size of the product title and price on the collection page? 

---

Normally this is to be avoided you do not want to be giving all text the same visual weight.
Note vendors names are often ALLCAPS making them have more visual weight than text of the same size.

Alternatives to this include using brand logos by the text or as part of the photography or an overlay, or that the navigation should be set up to emphasize brands if that is what the customer focus is.

Before making a change like this be sure you have a valid reason and are not just wasting time playing designer.

This merchant has a validated customer case to do this:

---

It is slightly inconvenient since our customers are giving us feedback that it is hard to see the vendor name on desktop (mobile looks okay, but would like the option to make it bigger as well on mobile). 

---

Always backup themes and files before making changes to code

Merchants that need this customization can contact me at paull.newton+shopifyforums@gmail.com with topic url, store url, theme and use-case details.

Add the following CSS to the bottom of component-card.css , or in a <style></style> tag at the bottom of theme.liquid, or relevant collection template

#product-grid .card-information__wrapper .caption-with-letter-spacing {
    color: rgb(var(--color-foreground));
    font-size: 1.6rem;
    opacity: 1;
}

The opacity style is to override the class making the vendor text lighter, to permanently make it no longer lighter you need to remove the "light" class from the element in snippets/product-card.liquid at line=24

Dawn Reference https://github.com/Shopify/dawn/blob/main/snippets/product-card.liquid#L24