How can I change color settings in my custom theme?

Topic summary

A user seeks help changing specific color elements in their custom Shopify theme for their store (festivalvanity.myshopify.com).

Requested Changes:

  • Product names on collection pages: change to pink (#FC909D) instead of current orange
  • Collection page elements: modify colors for “Filter”, “Sort By”, and “# Products” text to #061B4C
  • Dynamic buttons on product pages: switch “buy now” button to #061B4C and “sold out” button to #FC909D

Solutions Provided:

Two community members offered CSS-based solutions:

  1. ThePrimeWeb suggested adding custom CSS code in the theme.liquid file below the <head> tag (screenshot provided for reference)

  2. PageFly-Henry recommended inserting CSS code at the bottom of the base.css file, providing specific selectors for product forms, card information links, and filter labels

Both responses include code snippets targeting the requested color changes. The discussion remains open as the original poster has not confirmed whether either solution resolved their issue.

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

Hi! I’m using a custom theme that I’ve been altering for my needs. I can’t seem to change the colors on a few things. Help is appreciated!

  1. On all of my collections pages, I’d like to change the color of all the product names to #FC909D. Essentially whenever you see a grid of multiple products, I’d like for the product names to be pink, not orange as shown.

  1. On my collections pages, I’d like to change the color of “Filter”, “Sort By”, and “# Products” to #06B1C4.

Festivalfiend_1-1710687584881.png

  1. Lastly is it possible to change the colors of the dynamic “sold out” and “buy now” buttons on product pages? I’d like to switch the colors to #06B1C4 for buy now and #FC909D for sold out.

Thank you!

Site: festivanity.myshopify.com

Password: awtwow

Hey @Festivalfiend ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.


Screenshot is for reference only, the correct code to paste is the one shown above.

1 Like

Hi @Festivalfiend

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

h2#verticalTitle ,

h2.facet-filters__label.caption-large.text-body ,

span#ProductCountDesktop { color: #06B1C4 !important;}

.card__information a {

color: #FC909D !important;

}

.product-form__submit {

background: #FC909D !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly