How can I add a black line under my header on Dawn that is thicker? Also add white space to banner

Store Design

Topic summary

Goal: make the header’s bottom border thicker in the Dawn theme and add white space above the Image Banner.

Proposed solution (Dawn, Shopify 2.0):

  • In base.css, set a thicker border on the header: apply “border-bottom: 5px solid black” to #shopify-section-header.
  • In section-image-banner.css, add top spacing by setting “margin-top” (e.g., 2.4rem) on the .banner element.

Resources: a video tutorial link was shared; the CSS edits are the key steps.

Clarifications:

  • Dawn and Debut are Shopify themes; Shopify 2.0 refers to the newer theme architecture.
  • base.css and section-image-banner.css are theme stylesheet files where these changes are made.

Open items:

  • A user asked for the store URL, likely to offer tailored help.
  • Another user asked whether a (thin) line can be added similarly in the Debut theme; no response yet.

Status: solution provided for Dawn via CSS edits; applicability to Debut and other themes remains unanswered/ongoing.

Summarized with AI on February 4. AI used: gpt-5.
1

Hey guys!

How can I add a thick black line under my header - I have tried the largest amount offered by Dawn theme but it is too thin - Also I don’t like that the image banner has no white space above it, how can I add some white space to my Image Banner on Dawn theme

I think this is the same for all Shopify 2.0 themes??

Please help!

2

The video:

Around line 2000 the last line of this code In base.css add:

/* section-header */
#shopify-section-header {
  z-index: 3;
  border-bottom: 5px solid black;

and then to add white space on 5th line add the final line of this code in section-image-banner.css add:

.banner {
  display: flex;
  position: relative;
  flex-direction: column;
  margin-top: 2.4rem;
}
3

@funkydropshippi
Hello,
Can You Please Share Your Store URL…

4

Can this be done for Debut? a thin line?