How do I change the blue hyperlink to black

Store Design
1

Hello

I am trying to change the hyperlink color on one of my pages from blue to black but I cannot figure out how to do so. After some searching, I was able to removed the underlining but now I would like to change to text color. Any suggestions will be appreciated.

Here is the link to the page in question.

https://www.derlyneguiteau.com/pages/discover-your-signature-scent

2

Hello @derlynegee

To change the blue hyperlink color to black on your page (https://www.derlyneguiteau.com/pages/discover-your-signature-scent), you can apply custom CSS.

Since Shopify doesn’t allow direct CSS editing in the page editor, you can either:

Option 1: Add CSS in your theme’s custom code section

  1. Go to Online Store > Themes in your Shopify admin.

  2. Click Customize on your current theme.

  3. In the theme editor, click the three dots (···) in the top left, then choose Edit code.

  4. In the Assets folder, find and open base.css (or it might be named theme.css or styles.css, depending on your theme).

  5. Scroll to the bottom and add this CSS:

/* Make all links black and remove underline on the Signature Scent page */
.page-discover-your-signature-scent a {
  color: black !important;
  text-decoration: none;
}

This uses the .page-discover-your-signature-scent class that Shopify adds to the tag based on your page handle.

  1. Save the file.

Option 2: Inline CSS (not recommended for long-term use)
If you only need this on a specific block or section, you can also add inline styles directly in the page content (via Pages > Discover Your Signature Scent > Edit):

Shop Perfumes

But for consistency and maintainability, Option 1 is better.

Thank you :blush:

3

Hello @derlynegee

Hope you are doing well.

Where you have added code for removing underline just add code color:black; there and it will work for you. For clarity checkout this image:-

Test91_0-1747309332948.png
Test91_0-1747309332948.png1365×613 146 KB

If it works for you Like this post and Mark it as accepted solution.
Thanks and Regards,
Test91

4

Hello @derlynegee

Go to online store ----> themes ----> actions ----> edit code ----> base.css
add this code at the end of the file and save.

.color-background-1.gradient a {
color: #000 !important;
}

result

38.png
38.png498×416 98.8 KB

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

5

That worked! thank you!

6

The first option you provided did not work for me but the second does.

7

Thank you! This works!!!