diff --git a/astro.config.mjs b/astro.config.mjs
index 8681929..350cdda 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -24,8 +24,8 @@ export default defineConfig({
'Self-hosted sandboxes in your own AWS account: a virtual machine per workspace, snapshots with memory, rollback, and a diff of what changed.',
// The organization's own mark (spin-stack/brand): the tile on its navy in dark, and clear in light,
// where the tile would read as a sticker. No alt: the name is written beside it.
- logo: { dark: './src/assets/logo.png', light: './src/assets/logo-light.png', alt: '' },
- favicon: '/favicon.png',
+ logo: { dark: './src/assets/logo.svg', light: './src/assets/logo-light.svg', alt: '' },
+ favicon: '/favicon.svg',
social: [{ icon: 'github', label: 'GitHub', href: 'https://github.com/spin-stack' }],
customCss: ['./src/styles/brand-tokens.css', './src/styles/brand-starlight.css', './src/styles/custom.css'],
// A hand-written page is edited here; a generated one names its source instead (Footer.astro).
@@ -42,6 +42,9 @@ export default defineConfig({
// The link preview a chat shows: public/og.png, by its absolute address.
{ tag: 'meta', attrs: { property: 'og:image', content: `${site}${base.replace(/\/$/, '')}/og.png` } },
{ tag: 'meta', attrs: { name: 'twitter:card', content: 'summary_large_image' } },
+ // The tab's mark where a browser takes no SVG, and the one iOS puts on a home screen.
+ { tag: 'link', attrs: { rel: 'icon', type: 'image/png', sizes: '64x64', href: `${base.replace(/\/$/, '')}/favicon.png` } },
+ { tag: 'link', attrs: { rel: 'apple-touch-icon', href: `${base.replace(/\/$/, '')}/apple-touch-icon.png` } },
{
tag: 'link',
attrs: { rel: 'alternate', type: 'text/plain', title: 'llms.txt', href: `${base.replace(/\/$/, '')}/llms.txt` },
diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
new file mode 100644
index 0000000..d16a62a
Binary files /dev/null and b/public/apple-touch-icon.png differ
diff --git a/public/favicon.png b/public/favicon.png
index 42f9c0a..9bc544a 100644
Binary files a/public/favicon.png and b/public/favicon.png differ
diff --git a/public/favicon.svg b/public/favicon.svg
new file mode 100644
index 0000000..bce56e2
--- /dev/null
+++ b/public/favicon.svg
@@ -0,0 +1,68 @@
+
diff --git a/public/mark.png b/public/mark.png
index 60087d7..0e1bf2b 100644
Binary files a/public/mark.png and b/public/mark.png differ
diff --git a/src/assets/logo-light.png b/src/assets/logo-light.png
deleted file mode 100644
index 775bcb5..0000000
Binary files a/src/assets/logo-light.png and /dev/null differ
diff --git a/src/assets/logo-light.svg b/src/assets/logo-light.svg
new file mode 100644
index 0000000..765c9cf
--- /dev/null
+++ b/src/assets/logo-light.svg
@@ -0,0 +1,63 @@
+
diff --git a/src/assets/logo.png b/src/assets/logo.png
deleted file mode 100644
index 675024d..0000000
Binary files a/src/assets/logo.png and /dev/null differ
diff --git a/src/assets/logo.svg b/src/assets/logo.svg
new file mode 100644
index 0000000..bce56e2
--- /dev/null
+++ b/src/assets/logo.svg
@@ -0,0 +1,68 @@
+
diff --git a/tools/refgen/brand.go b/tools/refgen/brand.go
index 0efdc98..6c1a990 100644
--- a/tools/refgen/brand.go
+++ b/tools/refgen/brand.go
@@ -12,10 +12,14 @@ import (
var brandFiles = []struct{ from, to string }{
{"dist/tokens.css", "src/styles/brand-tokens.css"},
{"dist/starlight.css", "src/styles/brand-starlight.css"},
- {"logos/mark-256.png", "src/assets/logo.png"},
- {"logos/mark-clear-256.png", "src/assets/logo-light.png"},
- {"logos/mark-512.png", "public/mark.png"},
+ // The mark as brand draws it, a vector: sharp in the header and the tab at any size and on a 2x
+ // screen. The PNGs are for what takes no SVG: an older browser's tab, iOS's home screen.
+ {"logos/mark.svg", "src/assets/logo.svg"},
+ {"logos/mark-clear.svg", "src/assets/logo-light.svg"},
+ {"logos/mark.svg", "public/favicon.svg"},
{"logos/favicon-64.png", "public/favicon.png"},
+ {"logos/apple-touch-icon.png", "public/apple-touch-icon.png"},
+ {"logos/mark-512.png", "public/mark.png"},
{"shots/shots.json", "src/data/shots.json"},
}