How do I alter paragraph color and line spacing on my site?

Store Design

Topic summary

Goal: change a specific paragraph’s text to black and reduce letter spacing on a Dawn theme page.

Context and access:

  • Initial site was password-protected; a public preview link was shared.
  • Target text is the paragraph under the main heading: “Nakamura-Sensei, can you tell us about yourself?”

Approach provided:

  • Edit CSS via Online Store > Themes > Actions > Edit code, then in Assets (base.css/style.css/theme.css).
  • First attempt targeted the H1 (line-height and blue color), which didn’t address the paragraph.
  • Final CSS targets the rich text paragraph and adjusts color and letter spacing:
    .rte.scroll-trigger.animate–slide-in p { color: black; letter-spacing: -0.5px; }

Notes:

  • “letter-spacing” controls the spacing between characters; a negative value tightens spacing.
  • Screenshots showed the effect; no code beyond CSS was required.

Status:

  • A workable CSS solution was provided with a demonstrated result screenshot.
  • The original poster hasn’t explicitly confirmed resolution; discussion appears close to resolved.
Summarized with AI on January 22. AI used: gpt-5.
1

Hi, here is my site: https://bc58f9.myshopify.com/pages/about-nakamura-sensei

I want to change the paragraph text color to black, and I want the letter spacing to be 0, how do I do this? It is a page

It is dawn theme.

Thanks.

1 Like
2

Hi @noobnoobqestio ,

Can I give a try? Your store website is password protected. Thanks!

3

Oh sorry, here is public link https://3oey6bxs2my4nsht-79877701909.shopifypreview.com/pages/about-nakamura-sensei

1 Like
4

Thank you for the information. Can I ask some clarification which paragraph youll like to adjust the line space and color? Is this one?

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
h1.main-page-title.page-title.h0.scroll-trigger.animate--fade-in {
    line-height: 30px;
    color: blue;
}

Result:

Ribe_Dagandara_0-1690840098925.png
Ribe_Dagandara_0-1690840098925.png737Ă—243 12.2 KB

I hope it help.

5

Thanks for the reply! Sorry what I meant is this part:
“Nakamura-Sensei, can you tell us about yourself?”

Its right under the heading part there (it’s paragraph text), I want the letters to be closer together so I’m focusing on letter spacing, and the color to be black because currently its grey, thanks

1 Like
6

Thank you for clarification. Try this one. Its same instruction.

.rte.scroll-trigger.animate--slide-in p {
    color: black;
    letter-spacing: -0.5px;
}

Result:

Ribe_Dagandara_0-1690874816129.png
Ribe_Dagandara_0-1690874816129.png461Ă—156 2.02 KB

I hope it help.

1 Like