How can I modify the vector font on a product image?

Topic summary

A user wants to change the font of the vendor name (“kick duo”) displayed on product cards, not the product title or price. The term “vector font” caused initial confusion among helpers.

Key clarifications:

  • The target text is the vendor field shown beneath product images on collection pages
  • The user doesn’t have a specific font in mind, just wants customization capability
  • Multiple support accounts requested the store URL (www.kickduo.com, password: pass-dogp) to investigate

Proposed solution:
Made4uo-Ribe provided CSS instructions:

  1. Navigate to Online Store > Themes > Edit code
  2. Open the base.css file in the Assets folder
  3. Add custom CSS targeting .product__text.caption-with-letter-spacing with desired font-family

The discussion clarified this is a CSS customization task, not related to adding vector font files to Shopify. The solution involves editing theme code to apply a different font to the vendor text element specifically.

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

how do I just change the vectors font on the product image

Hi @kickduo

Do you mind sharing your store URL? and include the pw if there is.

Thanks!

Hello @kickduo

Did you add vector fonts to the theme?

Can you give me your page URL (with pass if your store password is enabled), so I can check it and maybe give you a solution?

Kind & Best regards,
GemPages Support Team

Hi @kickduo

Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

www.kickduo.com pass-pdog

thank you very much

thanks so much www.kickduo.com pass-pdog

@kickduo ,

You already download the fonts?

the Vector Font is already added in the Shopify?

I just need to to know the code to change the vector font?

Hi @kickduo ,

Thank you for the information but I did not understand on what you need. Please check the video below and also you can use the following codes below as an example.

Please check the video in this solution here.

https://community.shopify.com/c/shopify-design/adding-custom-font-dawn/m-p/1664154

hello, on my product card where it shows the tittle of my product the vendor and price. as you can see in the photo above vendor is “kick duo” I just want to change the font of that text only on the page

Hi @kickduo ,

Thank you for the information. Its the name or title of the product you want to change “Kick Dou’s Sneaker Cleaning Kit” into Vector Font? am I right?

no I would like to change the work "kick duo " under the tittle, thats the font I would like to change thanks

No I want to change the vector font only to something different

Hi @kickduo

We are not sure what type of vector font you want to add. Please provide the font type information, and if possible, please share your store access with us so we can help you as this involves editing theme code. Thanks!

I dont have a specific font I just want to be able to customise any?

Hi @kickduo ,

Sorry for the confusion. But what I understand, you want to change the font of the vendor, and nothing to do with “Vector.” If so, please follow the instructions below

  1. From you Admin page, go to Online store > Themes and click the three dots then Edit code

  2. Open the base.css file under Asset folder

  3. Add the code below at the very end of the file

NOTE: Change “your-font”, to whatever font you want.

p.product__text.caption-with-letter-spacing {
 font-family: "your-font";
 }