diff --git a/assets/scss/hugo-tufte-options.scss b/assets/scss/hugo-tufte-options.scss
new file mode 100644
index 0000000..c33ecd9
--- /dev/null
+++ b/assets/scss/hugo-tufte-options.scss
@@ -0,0 +1,10 @@
+{{ if and (isset .Site.Params "sanssubtitle") .Site.Params.sansSubtitle  }}
+h2, h3 {
+    font-style: normal;
+    font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif, "Noto Emoji";
+}
+{{ end }}
+
+{{ if and (isset .Site.Params "centerarticle") .Site.Params.centerArticle  }}
+// tba
+{{ end }}
diff --git a/assets/scss/tufte.scss b/assets/scss/tufte.scss
index 143d849..a701941 100644
--- a/assets/scss/tufte.scss
+++ b/assets/scss/tufte.scss
@@ -54,6 +54,10 @@
     font-style: normal;
 }
 
+$serif-fonts: et-book, "Noto Serif SC", Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif, "Noto Emoji";
+$sans-fonts: "Gill Sans", "Gill Sans MT", Calibri, sans-serif, "Noto Emoji";
+$mono-fonts: Consolas, "Liberation Mono", Menlo, Courier, monospace, "Noto Emoji";
+
 /* Tufte CSS styles */
 html {
     font-size: 15px;
@@ -63,36 +67,36 @@ body {
     margin-left: auto;
     margin-right: auto;
     padding-left: 12.5%;
-    font-family: et-book, "Noto Serif SC", Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif, "Noto Emoji";
+    font-family: $serif-fonts;
     background-color: #fffff8;
     color: #111;
     max-width: 1400px;
 }
 
-h1 {
+h1, h2, h3 {
     font-weight: 400;
+    line-height: 1;
+}
+
+h1 {
     margin-top: 4rem;
     margin-bottom: 1.5rem;
     font-size: 3.2rem;
-    line-height: 1;
+}
+
+h2, h3 {
+    font-style: italic;
+    margin-bottom: 0;
 }
 
 h2 {
-    font-style: italic;
-    font-weight: 400;
     margin-top: 2.1rem;
-    margin-bottom: 0;
     font-size: 2.2rem;
-    line-height: 1;
 }
 
 h3 {
-    font-style: italic;
-    font-weight: 400;
     font-size: 1.7rem;
     margin-top: 2rem;
-    margin-bottom: 0;
-    line-height: 1;
 }
 
 .author, .date {
@@ -350,14 +354,14 @@ div.table-wrapper {
 }
 
 .sans {
-    font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif, "Noto Emoji";
+    font-family: $sans-fonts;
     letter-spacing: 0.03em;
 }
 
 code,
 .code,
 kbd {
-    font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace, "Noto Emoji";
+    font-family: $mono-fonts;
     font-size: 1.125rem;
     line-height: 1.42;
 }
diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml
index 53b7a8c..38ff42a 100644
--- a/exampleSite/config.yaml
+++ b/exampleSite/config.yaml
@@ -46,7 +46,12 @@ params:
   math: true
   KaTeXVersion: 0.16.4
   KaTeXCDN: "//cdn.jsdelivr.net/npm"
-  # Common social website links, please comment the unused ones.
+  # #### Control style flavours of the website
+  # Use upright & sans-serif font for subtitles
+  sansSubtitle: false
+  # Make the page centred in screen
+  centerArticle: false
+  # ######## Common social website links, please comment the unused ones.
   # (if your favorite one is not in the list, please head to the footer menu below and add an entry)
   # Please note that some of the value below are only provided as an exemple, perhaps the computed isn't valid
   # github: slashformotion
diff --git a/layouts/partials/header.includes.html b/layouts/partials/header.includes.html
index 55bf942..1b5f489 100644
--- a/layouts/partials/header.includes.html
+++ b/layouts/partials/header.includes.html
@@ -27,4 +27,8 @@
 {{ $htstyle := resources.Get "scss/hugo-tufte.scss"| resources.ExecuteAsTemplate "main.scss" .  | resources.ToCSS $htoptions }}
 <link rel="stylesheet" href="{{ $htstyle.Permalink | relURL }}">
 
+{{ $ht_o_options := (dict "targetPath" "/css/hugo-tufte-options.min.css" "outputStyle" "compressed" "enableSourceMap" true) }}
+{{ $ht_o_style := resources.Get "scss/hugo-tufte-options.scss"| resources.ExecuteAsTemplate "main.scss" .  | resources.ToCSS $ht_o_options }}
+<link rel="stylesheet" href="{{ $ht_o_style.Permalink | relURL }}">
+
 <link rel="stylesheet" href="{{ "/css/hugo-tufte-override.css" | relURL }}">