diff --git a/config.toml b/config.toml
index f2c9094..17b867e 100644
--- a/config.toml
+++ b/config.toml
@@ -176,6 +176,12 @@ default_theme = "light"
# All other skins have optimal contrast.
skin = ""
+# List additional stylesheets to load site-wide.
+# These stylesheets should be located in your site's `static` directory.
+# Example: stylesheets = ["extra1.css", "path/extra2.css"]
+# You can load a stylesheet for a single post by adding it to the [extra] section of the post's front matter, following this same format.
+stylesheets = []
+
# Add a "copy" button to codeblocks (loads ~700 bytes of JavaScript).
copy_button = true
diff --git a/templates/partials/header.html b/templates/partials/header.html
index 50b78e8..1d7c6fe 100644
--- a/templates/partials/header.html
+++ b/templates/partials/header.html
@@ -28,13 +28,29 @@
{% endif %}
-
+ {# Define array of CSS files to load. main.css is always loaded. #}
+ {%- set stylesheets = [ "main.css" ] -%}
+
+ {# Load extra CSS files from config.toml #}
+ {%- if config.extra.stylesheets -%}
+ {%- set stylesheets = stylesheets | concat(with=config.extra.stylesheets) -%}
+ {%- endif -%}
+
+ {# Load extra CSS files from page metadata #}
+ {%- if page.extra.stylesheets -%}
+ {%- set stylesheets = stylesheets | concat(with=page.extra.stylesheets) -%}
+ {%- endif -%}
{# Load extra CSS for custom skin #}
{%- if config.extra.skin and config.extra.skin != "teal" -%}
-
+ {%- set stylesheets = stylesheets | concat(with='skins/' ~ config.extra.skin ~ '.css') -%}
{%- endif -%}
+ {# Load all stylesheets #}
+ {%- for stylesheet in stylesheets %}
+
+ {%- endfor %}
+
{%- if page.description %}
diff --git a/theme.toml b/theme.toml
index 87a3ff7..09e4bdb 100644
--- a/theme.toml
+++ b/theme.toml
@@ -61,6 +61,12 @@ default_theme = "light"
# All other skins have optimal contrast.
skin = ""
+# List additional stylesheets to load site-wide.
+# These stylesheets should be located in your site's `static` directory.
+# Example: stylesheets = ["extra1.css", "path/extra2.css"]
+# You can load a stylesheet for a single post by adding it to the [extra] section of the post's front matter, following this same format.
+stylesheets = []
+
# Add a "copy" button to codeblocks (loads ~700 bytes of JavaScript).
copy_button = true