krz/orgo

Lightning fast org-mode static site generator.

clone: git clone https://gitbay.org/krz/orgo.git

92e71e0a4952e1bafb38582b0ce73948afb7d33d

unsigned

author: Christian Cleberg <hello@cleberg.net> · 2026-08-12T04:57:35Z

Give the docs site a favicon

The docs had none, so every tab showed the generic page icon and browsers
fell back to requesting /favicon.ico, which the site does not serve.

The mark is an indented org outline — three headings, six shapes — which
is what the site is about, and legible at 16px. It carries the accent
colour from style.css and swaps it under prefers-color-scheme, matching
the two schemes the stylesheet already defines.

SVG only. Safari before 16 and IE fall back to no icon rather than a
stale one, which is the same as today.

 docs/favicon.svg         | 14 ++++++++++++++
 docs/templates/base.html |  1 +
 2 files changed, 15 insertions(+)

diff --git a/docs/favicon.svg b/docs/favicon.svg
new file mode 100644
index 0000000..d603fc6
--- /dev/null
+++ b/docs/favicon.svg
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <!-- An org outline: three headings, indented. Drawn plainly enough to survive 16px,
+       and coloured from the same accent the stylesheet uses, in both schemes. -->
+  <style>
+    :root { fill: #0b5fa5; }
+    @media (prefers-color-scheme: dark) { :root { fill: #79b8ff; } }
+  </style>
+  <circle cx="6" cy="8" r="2.5"/>
+  <rect x="12" y="6.5" width="14" height="3" rx="1.5"/>
+  <circle cx="12" cy="16" r="2.5"/>
+  <rect x="18" y="14.5" width="8" height="3" rx="1.5"/>
+  <circle cx="12" cy="24" r="2.5"/>
+  <rect x="18" y="22.5" width="8" height="3" rx="1.5"/>
+</svg>
diff --git a/docs/templates/base.html b/docs/templates/base.html
index 48e1af7..2b17c24 100644
--- a/docs/templates/base.html
+++ b/docs/templates/base.html
@@ -8,6 +8,7 @@
 <link rel="canonical" href="{{ page.url | absolute }}">
 {%- endif %}
 <meta name="description" content="{{ page.excerpt | truncate(150) }}">
+<link rel="icon" href="{{ root }}favicon.svg" type="image/svg+xml">
 <link rel="stylesheet" href="{{ root }}style.css">
 {%- if stylesheet %}
 <link rel="stylesheet" href="{{ stylesheet }}">