diff --git a/config/_default/params.toml b/config/_default/params.toml
index bad1d72c..4f99dcf3 100644
--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -45,6 +45,7 @@ enableCodeCopy = true
   showHero = true
   heroStyle = "basic" # valid options: basic, big, background
   layoutBackgroundBlur = false # only used when heroStyle equals background
+  layoutBackgroundMoreSpaceBetweenHeaderAndBody = true # only used when heroStyle equals background
   showBreadcrumbs = true
   showDraftLabel = true
   showEdit = true
@@ -65,6 +66,7 @@ enableCodeCopy = true
 [list]
   #showHero = true
   #heroStyle = "background" # valid options: basic, big, background
+  #layoutBackgroundMoreSpaceBetweenHeaderAndBody = true # only used when heroStyle equals background
   showBreadcrumbs = false
   showSummary = false
   #showViews = true
diff --git a/layouts/partials/hero/background.html b/layouts/partials/hero/background.html
index 01893a07..fe16c4cf 100644
--- a/layouts/partials/hero/background.html
+++ b/layouts/partials/hero/background.html
@@ -4,7 +4,9 @@
 {{- if not $featured }}{{ with .Site.Params.defaultBackgroundImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
 {{- with $featured -}}
 {{ with .Resize "1200x" }}
+{{ if $.Site.Params.article.layoutBackgroundMoreSpaceBetweenHeaderAndBody | default true }}
 <div id="hero" class="h-[150px] md:h-[200px]"></div>
+{{ end }}
 <div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
     style="background-image:url({{ .RelPermalink }});">
     <div class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal">