How can I alter my item text color in the website UI?

Store Design
,
1

Hi,

I want to change the color of my item’s text. It doesn’t work from shopify’s UI and I tried coding it by myself but it did not work out.

Those are the items:

https://sansleepstore.myshopify.com/products/simulated-sunrise-and-sunset-natural-wake-up-light-smart-table-lamp

https://sansleepstore.myshopify.com/products/round-light-glasses

Password: 12345

I want the color to be #B2E0FC

2

Hi @noriscash

Kani_0-1669597623933.png
Kani_0-1669597623933.png1738×941 269 KB

1: Online store > themes > Actions > Edit code > Layout > theme.liquid

find

*,
*::before,
*::after {
    box-sizing: inherit;
}

replace with this code

*,
*::before,
*::after {
    box-sizing: inherit;
    color: #B2E0FC!important;
}
1 Like
3

Thanks, it works but now my buttons are messed up

Screenshot 2022-11-28 174122.png
Screenshot 2022-11-28 174122.png1198×597 80.1 KB

4

1: Online store > themes > Actions > Edit code > Assets > section-main-product.css

2: find .shopify-payment-button__button–unbranded

replace

.shopify-payment-button__button--unbranded {
  background-color: rgba(var(--color-button), var(--alpha-button-background));
  color: rgb(var(--color-button-text));
  font-size: 1.4rem;
  line-height: calc(1 + 0.2 / var(--font-body-scale));
  letter-spacing: 0.07rem;
}

with

.shopify-payment-button__button--unbranded {
  background-color: rgba(var(--color-button), var(--alpha-button-background));
  color: rgb(var(--color-button-text))!important;
  font-size: 1.4rem;
  line-height: calc(1 + 0.2 / var(--font-body-scale));
  letter-spacing: 0.07rem;
}
1 Like