Drupal8でw3cssテーマ（theme）の初期フォントサイズ（font-size）設定が大き目になっているので、調整する必要があります。

Drupal8のw3cssテーマ設定画面（ホーム >> 管理 >> テーマ >> Appearance settings >> w3_css theme）では、フォント関連設定項目がないようで、cssスタイルで設定したほうが良いでしょう

サブテーマ（sub-theme）でフォントサイズ（font-size）を設定

• w3cssのサブテーマを作成します
  • Drupal8のサブテーマ作成について「Drupal8のテーマ（theme）の構造及びディレクトリの整理 」をご参考
• 作成したサブテーマのcss定義（例：style.css）にフォントサイズを再定義します

  h1{font-size:28px;}
  h2{font-size:24px;}
  h3{font-size:20px;}
  h4{font-size:18px;}
  h5{font-size:16px;}
  h6{font-size:14px;}

   

• css定義更新後に、Drupal8のキャッシュクリアを忘れずにしてください

見出し（H1）のフォントサイズが変わらない問題

• 見出し（h2）などが順調に変更できました
• 見出し（h1）が変わらないことを気づきました
• ブラウザの開発ツールで見出し（H1）を確認します
  
• 見出し（H1）のフォントサイズ設定はcssクラス：w3-xxlargeで管理しているようです

解決：サブテーマのcss定義でh1.w3-xxlargeクラスを再設定

• 見出し（H1）を限定して、w3-xxlargeのフォントサイズを設定します

  h1, h1.w3-xxlarge{font-size:28px!important;}
  h2{font-size:24px;}
  h3{font-size:20px;}
  h4{font-size:18px;}
  h5{font-size:16px;}
  h6{font-size:14px;}

   

• 「w3-xxlarge{font-size:28px;}」のような設定を避けたほうが良いでしょう。なぜならば、ここで見出し（H1）のフォントサイズを再定義、ほかの部分のw3-xxlargeの定義を変更するつもりはありません
• これで、見出し（H1）のフォントサイズが順調に変更されました
• 開発ツールで見出し（H1）のフォントサイズがオーバーライドされました
  

Drupal8のw3cssのインデント（ul/li タブ）の上下間隔が比較的に広い（16px以上）ように見えます。全体的なバランスから見ると、変更する必要があります。

Drupal8のw3cssテーマ管理画面（ホーム >> 管理 >> テーマ >> Appearance settings >> w3_css theme）では、インデント上下の設定項目はないようで、cssスタイルで変更したほうが良いでしょう。

w3cssの初期インデント上下間隔が広い

• ブラウザの開発ツールでサイドバーのインデント（ul/li）タグのプロパティを確認します
• インデント上下の間隔（ul/liタグ）がmargin, padding で設定され、合わせてみたら16pxもあります
  

サブテーマ（sub theme）でインデントの上下間隔を変更

• w3cssのサブテーマを作成します
  • Drupal8のサブテーマ作成について「Drupal8のテーマ（theme）の構造及びディレクトリの整理 」をご参考
• サブテーマのcss定義ファイル（style.css）でインデント上下のmargin, padding 要素間隔を設定します

  .w3-sidebar-second .view-content ul li{
      margin: 0;
      padding: 0 1em;
  }

   

• css設定が簡単で、結果は以下の用となります
  

Drupal8のテーマ：w3css がインストール後の初期画面が比較的に特徴がなく、ごく普通の画面と同じような画面で、文字フォント、間隔、インデント、リージョンなどの調整がしないと、見た目ではあまり使用する価値がありません

w3cssの初期画面で、メイン・コンテント・リージョン（main content region）がバックグラント（background color）カラーと同じで、このリージョンの認識は難しいです

w3css管理画面で「Enable/Disable Match Height for Main Contaners」の設定

• w3cssでメイン・コンテント・リージョンのハイライト（highlight）設定があります
• 設定画面： ホーム >> 管理 >> テーマ >> Appearance settings >> w3_css theme で「DISABLE/ENABLE MATCH HEIGHT」項目があります
  • 「Enable/Disable Match Height for Main Containers」項目をチェックします
    

メイン・コンテンツ・リージョン（main content region）が立体的にハイライトされた

• 上記表示設定後に、サイトホームに戻ると、メイン・コンテンツ・リージョンが立体的にハイライトされました。
  

w3cssの設定より各リージョンのハイライトが可能

• 初期として、なんにも設定していないため、見た目はあまりぱっとしないです
• リージョン・ハイライトを設定してみたら、はっきりしたハイライト効果が出来ました
• w3cssの柔軟性がここでも感じました