How can I customize text font in specific items without altering Base.css?

Store Design
, , , , ,

Topic summary

Goal: Change the single banner heading “FIND YOUR FESTIVAL OUTFIT” styling (color, weight, spacing) in Dawn without altering the global h2 in Base.css.

Context: Shopify Dawn theme; site link provided. Base.css is the theme’s main stylesheet.

Proposed approaches:

  • Section custom CSS: Add h2 { color: red; }. This affects all h2 site‑wide, not the single instance.
  • theme.liquid edit: Steps to paste code were shared, but the actual code snippet was missing, so outcome is unclear.
  • Helper classes: Define classes in Base.css (e.g., .bold { font-weight:700; }, .red { color:red; }) and apply them to the specific heading element. Example shows using these classes on the target text to localize styling.

Notes: A screenshot of the banner was attached; no code or selectors targeting that specific section/block ID were provided.

Status: No confirmed resolution. The helper-class method is the most concrete path offered but requires applying classes to the specific heading element in the relevant section.

Summarized with AI on January 3. AI used: gpt-5.
1

Hi there!

How can I change the font (color for example) of this text “FIND YOUR FESTIVAL OUTFIT” without changing the h2 definition in Base.css?

Is there a way to only touch this specific instance? for example editing the file section-image-banner.css?

I would like to specify a new font-weight, spacing etc …

Thanks a lot for your time!

Website: https://venga-store.com/

Theme: Dawn

miltokas_0-1710619247000.png
miltokas_0-1710619247000.png746×432 295 KB

2

Go to that section custom css by scrolling down to the end and add the following code:

h2 {color: red;}

change it to your desired color

3

Hi @miltokas ,

You can try this code by following these steps:

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

Step 2: Search file theme.liquid

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

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

4

You can create a helper class for that.

In base.css, create a class

.bold {
font-weight: 700;
}
.red {
color: red;
}

and you can use this class to any element.

Ex.

## FIND YOUR FESTIVAL *OUTFIT!*