summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--.gitignore4
-rw-r--r--CHANGELOG.md7
-rw-r--r--css/content.scss93
-rw-r--r--css/fonts.scss75
-rw-r--r--css/frontPage.scss43
-rw-r--r--css/main.scss26
-rw-r--r--css/navigationBar.scss52
-rw-r--r--html/about.html49
-rw-r--r--html/benoit.html41
-rw-r--r--html/bowshock.html19
-rw-r--r--html/bzipper.html27
-rw-r--r--html/eas.html23
-rw-r--r--html/luma.html35
-rw-r--r--html/pollex.html23
-rw-r--r--js/initImages.ts23
-rwxr-xr-xmake.sh21
-rw-r--r--shtml/initScripts.shtml5
-rw-r--r--shtml/navigationBar.shtml15
-rw-r--r--svg/achernar-old.svg5
-rw-r--r--svg/achernar.svg47
-rw-r--r--svg/benoit-background.svg10
-rw-r--r--svg/favicon.svg19
-rw-r--r--svg/glyph/achernar.svg38
-rw-r--r--svg/glyph/benoit.svg14
-rw-r--r--svg/glyph/bzipper.svg8
-rw-r--r--svg/glyph/eas.svg15
-rw-r--r--svg/glyph/luma.svg19
-rw-r--r--svg/glyph/pollex.svg28
28 files changed, 784 insertions, 0 deletions
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..e5d24e2
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
+*.css
+*.js
+*.ttf
+*.webp
diff --git a/CHANGELOG.md b/CHANGELOG.md
new file mode 100644
index 0000000..d69f207
--- /dev/null
+++ b/CHANGELOG.md
@@ -0,0 +1,7 @@
+# Changelog
+
+## 0.0
+
+* Add gitingore
+* Add changelog
+* Add build script
diff --git a/css/content.scss b/css/content.scss
new file mode 100644
index 0000000..bdac41c
--- /dev/null
+++ b/css/content.scss
@@ -0,0 +1,93 @@
+#content {
+ background-color: $backgroundColour;
+ margin: auto;
+ min-height: 100vh;
+ max-width: 72rem;
+ padding: 2rem;
+
+ p:not(.heading, #contentHeading) {
+ line-height: 2rem;
+ }
+
+ a, a:visited {
+ color: $highlightColour;
+ font-weight: bold;
+ }
+
+ span {
+ &.code {
+ background-color: $foregroundColour;
+ border-radius: calc(1rem / 4);
+ font-family: "Martian Mono", "monospace";
+ padding: calc(1rem / 4);
+
+ a {
+ font-weight: normal;
+ }
+ }
+
+ &.fancy {
+ font-weight: bold;
+ }
+
+ &.small {
+ font-size: 0.75em;
+ }
+ }
+
+ #contentHeading {
+ background-color: $foregroundColour;
+ border-radius: 1rem;
+ display: block;
+ font-family: "Martian Mono", "monospace";
+ font-size: 4rem;
+ font-weight: bold;
+ margin: auto;
+ margin-bottom: 1rem;
+ padding: 1rem;
+ text-align: center;
+
+ span.small {
+ font-size: 0.5em;
+ }
+ }
+
+ section:nth-of-type(even) p.heading {
+ text-align: right;
+ }
+
+ section + section {
+ margin-top: 1rem;
+ }
+
+ p.heading {
+ border-bottom-style: solid;
+ border-bottom-width: calc(1rem / 4);
+ font-size: 2rem;
+ font-weight: bold;
+ margin-bottom: 1rem;
+ width: 100%;
+ }
+
+ x-image {
+ display: block;
+ width: fit-content;
+
+ &:nth-of-type(odd) {
+ margin-right: auto;
+ }
+
+ &:nth-of-type(even) {
+ margin-left: auto;
+ }
+
+ a {
+ img {
+ border-radius: 1rem;
+ display: block;
+ height: 16rem;
+ image-rendering: pixelated;
+ }
+ }
+ }
+} \ No newline at end of file
diff --git a/css/fonts.scss b/css/fonts.scss
new file mode 100644
index 0000000..6abafc0
--- /dev/null
+++ b/css/fonts.scss
@@ -0,0 +1,75 @@
+@font-face {
+ font-family: "Martian Mono";
+ src: url("/ttf/MartianMono-Regular.ttf");
+}
+
+@font-face {
+ font-family: "Martian Mono";
+ font-weight: bold;
+ src: url("/ttf/MartianMono-Bold.ttf");
+}
+
+@font-face {
+ font-family: "Oswald";
+ src: url("/ttf/Oswald-Regular.ttf");
+}
+
+@font-face {
+ font-family: "Oswald";
+ font-weight: bold;
+ src: url("/ttf/Oswald-Bold.ttf");
+}
+
+@font-face {
+ font-family: "Oswald";
+ font-weight: bold;
+ src: url("/ttf/Oswald-Bold.ttf");
+}
+
+@font-face {
+ font-family: "Playfair Display";
+ src: url("/ttf/PlayfairDisplay-Regular.ttf");
+}
+
+@font-face {
+ font-family: "Playfair Display";
+ font-weight: bold;
+ src: url("/ttf/PlayfairDisplay-Regular.ttf");
+}
+
+@font-face {
+ font-family: "Playfair Display";
+ font-style: italic;
+ src: url("/ttf/PlayfairDisplay-Italic.ttf");
+}
+
+@font-face {
+ font-family: "Playfair Display";
+ font-style: italic;
+ font-weight: bold;
+ src: url("/ttf/PlayfairDisplay-BoldItalic.ttf");
+}
+
+@font-face {
+ font-family: "Raleway";
+ src: url("/ttf/Raleway-Regular.ttf");
+}
+
+@font-face {
+ font-family: "Raleway";
+ font-weight: bold;
+ src: url("/ttf/Raleway-Bold.ttf");
+}
+
+@font-face {
+ font-family: "Raleway";
+ font-style: italic;
+ src: url("/ttf/Raleway-Italic.ttf");
+}
+
+@font-face {
+ font-family: "Raleway";
+ font-style: italic;
+ font-weight: bold;
+ src: url("/ttf/Raleway-BoldItalic.ttf");
+}
diff --git a/css/frontPage.scss b/css/frontPage.scss
new file mode 100644
index 0000000..dc40d11
--- /dev/null
+++ b/css/frontPage.scss
@@ -0,0 +1,43 @@
+#frontPage {
+ align-items: center;
+ border-bottom-left-radius: 1rem;
+ border-bottom-right-radius: 1rem;
+ display: flex;
+ justify-content: center;
+ height: calc(100vh + 1rem);
+ padding-bottom: 1rem;
+ width: 100vw;
+
+ body.about & {
+ background-color: $achernarColour; }
+
+ body.benoit & {
+ background-image: url("/svg/benoit-background.svg");
+ background-size: cover;
+ }
+
+ body.bzipper & {
+ background-color: #FFFFFF;
+ }
+
+ body.eas & {
+ background-color: #01CD93;
+ }
+
+ body.luma & {
+ background-color: #6051B2;
+ }
+
+ body.pollex & {
+ background-color: #4D4084;
+ }
+
+ #glyph {
+ display: block;
+ font-size: 4rem;
+ font-weight: bold;
+ height: fit-content;
+ width: calc(100vmin / 2);
+ text-align: center;
+ }
+}
diff --git a/css/main.scss b/css/main.scss
new file mode 100644
index 0000000..e3cb1cd
--- /dev/null
+++ b/css/main.scss
@@ -0,0 +1,26 @@
+@import "fonts";
+
+$backgroundColour: oklch(20% 0.032625 270);
+$foregroundColour: oklch(25% 0.041075 270);
+$textColour: oklch(100% 0 0);
+$highlightColour: oklch(75% 0.292700 149.34);
+
+$achernarColour: #007B34;
+
+:root {
+ font-family: "Raleway", "sans-serif";
+
+ background-color: $backgroundColour;
+ color: $textColour;
+}
+
+* {
+ margin: 0;
+ padding: 0;
+
+ box-sizing: border-box;
+}
+
+@import "navigationBar.scss";
+@import "frontPage.scss";
+@import "content.scss";
diff --git a/css/navigationBar.scss b/css/navigationBar.scss
new file mode 100644
index 0000000..a8d6c10
--- /dev/null
+++ b/css/navigationBar.scss
@@ -0,0 +1,52 @@
+#navigationBar {
+ align-items: center;
+ backdrop-filter: blur(1rem);
+ background-color: $textColour;
+ background-color: color-mix(in srgb, $textColour, transparent 75%);
+ border-top-left-radius: 1rem;
+ border-top-right-radius: 1rem;
+ color: $backgroundColour;
+ display: flex;
+ gap: 0.25rem;
+ justify-content: center;
+ left: 50vw;
+ padding: 1rem;
+ position: fixed;
+ top: 100vh;
+ transform: translate(-50%, -1rem);
+ transition: 0.25s;
+ z-index: 1;
+
+ &:hover {
+ background-color: $textColour;
+ transition: 0.25s;
+ transform: translate(-50%, -100%);
+ }
+
+ a {
+ font-weight: bold;
+ text-decoration: none;
+
+ &, &:visited {
+ color: $backgroundColour;
+
+ &:first-of-type {
+ color: $achernarColour;
+ }
+ }
+ }
+
+ .groupSeparator {
+ background-color: $backgroundColour;
+ border-radius: 0.25rem;
+ height: 0.25rem;
+ width: 0.75rem;
+ }
+
+ .elementSeparator {
+ background-color: $backgroundColour;
+ border-radius: 100%;
+ height: 0.25rem;
+ width: 0.25rem;
+ }
+} \ No newline at end of file
diff --git a/html/about.html b/html/about.html
new file mode 100644
index 0000000..e00d98d
--- /dev/null
+++ b/html/about.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>Achernar</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="about">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <img id="glyph" src="/svg/glyph/achernar.svg">
+ </div>
+
+ <div id="content">
+ <p id="contentHeading">ABOUT</p>
+
+ <p><b>Achernar</b> is a danish-based development studio located in the Capital Region of Denmark.</p>
+
+ <section>
+ <p class="heading">THE FUTURE IS NOW</p>
+
+ <p>...</p>
+ </section>
+
+ <section>
+ <p class="heading">VISION</p>
+
+ <p>The goal of <b>Achernar</b> is to promote modern and robustly written open-source projects and alike. In simpler terms, our vision is to develop a human and clean industry and community for technology.</p>
+ </section>
+
+ <section>
+ <p class="heading">INCEPTION</p>
+
+ <p><b>Achernar</b> was founded in the summer of 2024 by I, <em>Gabriel Bjørnager Jensen</em>.</p>
+ <br>
+ <p>Our domain &ndash; <span class="code">achernar.dk</span> &ndash; was already registered in the winter of 2021, at that time being used for hosting on-line source code repositories. This was, however, quickly outsourced to <span class="code"><a href="https://mandelbrot.dk">mandelbrot.dk</a></span> after I had managed to secure that domain.</p>
+ <br>
+ <p><span class="code">achernar.dk</span> was then, in the mean time, used for hosting a few look-up references. This mostly served as my own notes for school &ndash; mainly mathematics, physics, and chemistry &ndash; but quickly grew unorganised and umaintained, although I did have plans to expand the lexicon.</p>
+ <br>
+ <p>The idea of a company had started in the spring of 2020 &ndash; at that time having been named after the binary system <em>Sheliak</em> (Bayer: <span class="code">&beta; Lyr&#230;</span>).</p>
+ </section>
+ </div>
+ </body>
+</html>
diff --git a/html/benoit.html b/html/benoit.html
new file mode 100644
index 0000000..d0b5953
--- /dev/null
+++ b/html/benoit.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>Benoit</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="benoit">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <img id="glyph" src="/svg/glyph/benoit.svg">
+ </div>
+
+ <div id="content">
+ <p id="contentHeading">BENOIT</p>
+
+ <section>
+ <p><span class="fancy">Benoit</span> is a Rust-written programme for visualising complex functions, e.g. <em>the Mandelbrot Set</em> and similar fractals.</p>
+ <br>
+ <p>The project consists of the core <a href="https://crates.io/crates/benoit/"><span class="code">benoit</span></a> crate, from which the frontends <span class="code">benoit-cli</span> and (in the future) <span class="code">benoit-gui</span> derive.</p>
+ </section>
+
+ <section>
+ <p class="heading">benoit-cli</p>
+ <br>
+ <p>The <span class="code">benoit-cli</span> executable can render and animate using <a href="https://en.wikipedia.org/wiki/TOML/">TOML</a> files right from the commandline.</p>
+ <br>
+ <x-image data-file="benoit_screenshot0"></x-image>
+ <br>
+ <x-image data-file="benoit_screenshot1"></x-image>
+ </section>
+ </div>
+
+ <!--#include virtual="/shtml/initScripts.shtml"-->
+ </body>
+</html>
diff --git a/html/bowshock.html b/html/bowshock.html
new file mode 100644
index 0000000..2a50e54
--- /dev/null
+++ b/html/bowshock.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>Bowshock</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="bowshock">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <p id="glyph">TO BE ADDED</p>
+ </div>
+ </body>
+</html>
diff --git a/html/bzipper.html b/html/bzipper.html
new file mode 100644
index 0000000..20ac359
--- /dev/null
+++ b/html/bzipper.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>bzipper</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="bzipper">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <img id="glyph" src="/svg/glyph/bzipper.svg">
+ </div>
+
+ <div id="content">
+ <p id="contentHeading">BZIPPER</p>
+
+ <p><span class="fancy">bzipper</span> is a Rust crate for serialisation and deserialisation of binary streams.</p>
+ <br>
+ <p>See more at <span class="code"><a href="https://crates.io/crates/bzipper/">crates.io</a></span>.</p>
+ </div>
+ </body>
+</html>
diff --git a/html/eas.html b/html/eas.html
new file mode 100644
index 0000000..2058e65
--- /dev/null
+++ b/html/eas.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>eAS</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="eas">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <img id="glyph" src="/svg/glyph/eas.svg">
+ </div>
+
+ <div id="content">
+ <p id="contentHeading"><span class="small">the </span>EMBEDDED ASSEMBLER</p>
+ </div>
+ </body>
+</html>
diff --git a/html/luma.html b/html/luma.html
new file mode 100644
index 0000000..01fc8ca
--- /dev/null
+++ b/html/luma.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>Luma</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="luma">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <img id="glyph" src="/svg/glyph/luma.svg">
+ </div>
+
+ <div id="content">
+ <p id="contentHeading">LUMA</p>
+
+ <section>
+ <p><span class="fancy">Luma</span> is an emulator for the <em>Game Boy Advance</em>-line of game consoles by Nintendo Co.</p>
+ </section>
+
+ <section>
+ <p class="heading">STATE</p>
+
+ <p>The state of <span class="fancy">Luma</span> is currently on hold in favour of <a href="/html/pollex.html"><span class="fancy">Pollex</span></a>, which is to be used as a backend.</p>
+ </section>
+ </div>
+
+ <!--#include virtual="/shtml/initScripts.shtml"-->
+ </body>
+</html>
diff --git a/html/pollex.html b/html/pollex.html
new file mode 100644
index 0000000..d472b2b
--- /dev/null
+++ b/html/pollex.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+
+ <link href="/svg/favicon.svg" rel="icon" type="image/svg+xml">
+ <title>Pollex</title>
+
+ <link href="/css/main.css" rel="stylesheet">
+ </head>
+
+ <body class="pollex">
+ <!--#include virtual="/shtml/navigationBar.shtml"-->
+
+ <div id="frontPage">
+ <img id="glyph" src="/svg/glyph/pollex.svg">
+ </div>
+
+ <div id="content">
+ <p id="contentHeading">POLLEX</p>
+ </div>
+ </body>
+</html>
diff --git a/js/initImages.ts b/js/initImages.ts
new file mode 100644
index 0000000..074de76
--- /dev/null
+++ b/js/initImages.ts
@@ -0,0 +1,23 @@
+function initImages() {
+ let content = document.getElementById("content")!;
+
+ let image_count = 0x0;
+ let image_list = Array.from(content.getElementsByTagName("x-image"));
+ for (let image of image_list) {
+ let file = image.getAttribute("data-file")!;
+ console.log("initialising image that links to \"" + file + "\"");
+
+ let image_element = document.createElement("img");
+ image_element.setAttribute("src", "/webp/thumbnail/" + file + ".webp");
+
+ let hyperlink_element = document.createElement("a");
+ hyperlink_element.setAttribute("href", "/webp/source/" + file + ".webp");
+ hyperlink_element.appendChild(image_element);
+
+ image.appendChild(hyperlink_element);
+
+ ++image_count;
+ }
+
+ console.log("initialised (" + image_count + ") image(s)");
+}
diff --git a/make.sh b/make.sh
new file mode 100755
index 0000000..04f42a3
--- /dev/null
+++ b/make.sh
@@ -0,0 +1,21 @@
+#!/usr/bin/env sh
+
+make_stylesheet() {
+ input="css/${1}.scss"
+ output="css/${1}.css"
+
+ echo "making stylesheet at \"${output}\"..."
+ sassc --style compressed "${input}" > "${output}"
+}
+
+make_script() {
+ input="js/${1}.ts"
+ output="js/${1}.js"
+
+ echo "making script at \"${output}\"..."
+ tsc --outFile "${output}" --target ES2022 "${input}"
+}
+
+make_stylesheet "main"
+
+make_script "initImages"
diff --git a/shtml/initScripts.shtml b/shtml/initScripts.shtml
new file mode 100644
index 0000000..77f8afd
--- /dev/null
+++ b/shtml/initScripts.shtml
@@ -0,0 +1,5 @@
+<script src="/js/initImages.js" type="text/javascript"></script>
+
+<script type="text/javascript">
+ initImages();
+</script>
diff --git a/shtml/navigationBar.shtml b/shtml/navigationBar.shtml
new file mode 100644
index 0000000..3077027
--- /dev/null
+++ b/shtml/navigationBar.shtml
@@ -0,0 +1,15 @@
+<div id="navigationBar">
+ <a href="/html/about.html">ABOUT</a>
+ <div class="groupSeparator"></div>
+ <a href="/html/benoit.html">BENOIT</a>
+ <div class="elementSeparator"></div>
+ <a href="/html/bowshock.html">BOWSHOCK</a>
+ <div class="elementSeparator"></div>
+ <a href="/html/bzipper.html">BZIPPER</a>
+ <div class="elementSeparator"></div>
+ <a href="/html/eas.html">eAS</a>
+ <div class="elementSeparator"></div>
+ <a href="/html/luma.html">LUMA</a>
+ <div class="elementSeparator"></div>
+ <a href="/html/pollex.html">POLLEX</a>
+</div>
diff --git a/svg/achernar-old.svg b/svg/achernar-old.svg
new file mode 100644
index 0000000..2c7d650
--- /dev/null
+++ b/svg/achernar-old.svg
@@ -0,0 +1,5 @@
+<svg height="60" width="60" xmlns="http://www.w3.org/2000/svg">
+ <rect fill="#1B1A1A" height="60" rx="12" width="60" x="0" y="0" />
+ <rect fill="#1B1A1A" height="12" width="12" x="0" y="0" />
+ <polygon fill="#F6F4F4" points="12,48 30,12 48,48 37.267,48 27.317,28.1 17.367,48" />
+</svg>
diff --git a/svg/achernar.svg b/svg/achernar.svg
new file mode 100644
index 0000000..84ccb2f
--- /dev/null
+++ b/svg/achernar.svg
@@ -0,0 +1,47 @@
+<svg height="112" width="336" xmlns="http://www.w3.org/2000/svg">
+ <!-- gradients: -->
+
+ <!-- clips: -->
+
+ <clipPath id="clip0">
+ <polygon points="68,64 80,64 80,96 68,96" />
+ </clipPath>
+
+ <!-- masks: -->
+
+ <mask id="wordmark">
+ <polygon fill="white" points="24,16 72,16 80,24 80,48 64,48 64,40 32,40 32,48 16,48 16,24" />
+ <circle cx="24" cy="24" fill="white" r="8" />
+ <circle cx="72" cy="24" fill="white" r="8" />
+ <polygon fill="black" points="32,24 64,24 64,32 32,32" />½
+ <polygon fill="white" points="104,16 160,16 160,24 112,24 112,40 160,40 160,48 104,48 96,40 96,24" />
+ <circle cx="104" cy="24" fill="white" r="8" />
+ <circle cx="104" cy="40" fill="white" r="8" />
+
+ <polygon fill="white" points="176,16 192,16 192,28 224,28 224,16 240,16 240,48 224,48 224,36 192,36 192,48 176,48" />
+
+ <polygon fill="white" points="256,16 320,16 320,24 272,24 272,28 288,28 288,36 272,36 272,40 320,40 320,48 256,48" />
+
+ <polygon fill="white" points="16,64 72,64 80,72 80,80 72,88 64,88 80,96 64,96 48,88 32,88 32,96 16,96" />
+ <circle cx="72" cy="72" fill="white" r="8" />
+ <circle cx="72" cy="80" fill="white" r="8" />
+ <polygon fill="black" points="32,72 64,72 64,80 32,80" />
+
+ <polygon fill="white" points="96,64 112,64 144,80 144,64 160,64 160,96 144,96 112,80 112,96 96,96" />
+
+ <polygon fill="white" points="184,64 232,64 240,72 240,96 224,96 224,88 192,88 192,96 176,96 176,72" />
+ <circle cx="184" cy="72" fill="white" r="8" />
+ <circle cx="232" cy="72" fill="white" r="8" />
+ <polygon fill="black" points="192,72 224,72 224,80 192,80" />
+
+ <polygon fill="white" points="256,64 312,64 320,72 320,80 312,88 304,88 320,96 304,96 288,88 272,88 272,96 256,96" />
+ <circle cx="312" cy="72" fill="white" r="8" />
+ <circle cx="312" cy="80" fill="white" r="8" />
+ <polygon fill="black" points="272,72 304,72 304,80 272,80" />
+ </mask>
+
+ <!-- fills: -->
+
+ <rect fill="#007B34" height="100%" width="100%" x="0" y="0" /> <!-- 356 C -->
+ <rect fill="#FFFFFF" mask="url(#wordmark)" height="100%" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/benoit-background.svg b/svg/benoit-background.svg
new file mode 100644
index 0000000..dda63a2
--- /dev/null
+++ b/svg/benoit-background.svg
@@ -0,0 +1,10 @@
+<svg height="96" width="96" xmlns="http://www.w3.org/2000/svg">
+ <polygon fill="#BA0035" points="0,0 96,0 96,96 0,96" /> <!-- oklch(50% 0.199 17.860) "red" -->
+ <polygon fill="#CD0325" points="0,0 96,0 96,96 19.096,96" />
+ <polygon fill="#DC1D02" points="0,0 96,0 96,96 39.765,96" />
+ <polygon fill="#E04400" points="0,0 96,0 96,96 64.145,96" />
+ <polygon fill="#E55C04" points="0,0 96,0 96,96 96,96" />
+ <polygon fill="#EB6F02" points="0,0 96,0 143.674,96" />
+ <polygon fill="#F18103" points="0,0 96,0 231.766,96" />
+ <polygon fill="#F79204" points="0,0 96,0 482.625,96" /> <!-- oklch(75% 0.170 63.220) "yellow" -->
+</svg>
diff --git a/svg/favicon.svg b/svg/favicon.svg
new file mode 100644
index 0000000..c2903f5
--- /dev/null
+++ b/svg/favicon.svg
@@ -0,0 +1,19 @@
+<svg height="96" width="96" xmlns="http://www.w3.org/2000/svg">
+ <!-- gradients: -->
+
+ <!-- clips: -->
+
+ <!-- masks: -->
+
+ <mask id="letter">
+ <polygon fill="white" points="24,32 72,32 80,40 80,64 64,64 64,56 32,56 32,64 16,64 16,40" />
+ <polygon fill="black" points="32,40 64,40 64,48 32,48" />
+ <circle cx="24" cy="40" fill="white" r="8" />
+ <circle cx="72" cy="40" fill="white" r="8" />
+ </mask>
+
+ <!-- fills: -->
+
+ <rect fill="#007B34" height="100%" rx="16" ry="16" width="100%" x="0" y="0" /> <!-- 356 C -->
+ <rect fill="#FFFFFF" mask="url(#letter)" height="100%" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/glyph/achernar.svg b/svg/glyph/achernar.svg
new file mode 100644
index 0000000..bc59aa5
--- /dev/null
+++ b/svg/glyph/achernar.svg
@@ -0,0 +1,38 @@
+<svg height="80" width="304" xmlns="http://www.w3.org/2000/svg">
+ <clipPath id="clip0">
+ <polygon points="52,48 64,48 64,80 52,80" />
+ </clipPath>
+
+ <mask id="glyph">
+ <polygon fill="white" points="8,0 56,0 64,8 64,32 48,32 48,24 16,24 16,32 0,32 0,8" />
+ <circle cx="8" cy="8" fill="white" r="8" />
+ <circle cx="56" cy="8" fill="white" r="8" />
+ <polygon fill="black" points="16,8 48,8 48,16 16,16" />½
+ <polygon fill="white" points="88,0 144,0 144,8 96,8 96,24 144,24 144,32 88,32 80,24 80,8" />
+ <circle cx="88" cy="8" fill="white" r="8" />
+ <circle cx="88" cy="24" fill="white" r="8" />
+
+ <polygon fill="white" points="160,0 176,0 176,12 208,12 208,0 224,0 224,32 208,32 208,20 176,20 176,32 160,32" />
+
+ <polygon fill="white" points="240,0 304,0 304,8 256,8 256,12 272,12 272,20 256,20 256,24 304,24 304,32 240,32" />
+
+ <polygon fill="white" points="0,48 56,48 64,56 64,64 56,72 48,72 64,80 48,80 32,72 16,72 16,80 0,80" />
+ <circle cx="56" cy="56" fill="white" r="8" />
+ <circle cx="56" cy="64" fill="white" r="8" />
+ <polygon fill="black" points="16,56 48,56 48,64 16,64" />
+
+ <polygon fill="white" points="80,48 96,48 128,64 128,48 144,48 144,80 128,80 96,64 96,80 80,80" />
+
+ <polygon fill="white" points="168,48 216,48 224,56 224,80 208,80 208,72 176,72 176,80 160,80 160,56" />
+ <circle cx="168" cy="56" fill="white" r="8" />
+ <circle cx="216" cy="56" fill="white" r="8" />
+ <polygon fill="black" points="176,56 208,56 208,64 176,64" />
+
+ <polygon fill="white" points="240,48 296,48 304,56 304,64 296,72 288,72 304,80 288,80 272,72 256,72 256,80 240,80" />
+ <circle cx="296" cy="56" fill="white" r="8" />
+ <circle cx="296" cy="64" fill="white" r="8" />
+ <polygon fill="black" points="256,56 288,56 288,64 256,64" />
+ </mask>
+
+ <rect fill="#FFFFFF" mask="url(#glyph)" height="100%" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/glyph/benoit.svg b/svg/glyph/benoit.svg
new file mode 100644
index 0000000..2107992
--- /dev/null
+++ b/svg/glyph/benoit.svg
@@ -0,0 +1,14 @@
+<svg height="72" width="72" xmlns="http://www.w3.org/2000/svg">
+ <mask id="glyph">
+ <ellipse cx="36" cy="36" fill="white" rx="36" ry="24" />
+ <ellipse cx="36" cy="36" fill="black" rx="33" ry="21" />
+
+ <ellipse cx="36" cy="36" fill="white" rx="30" ry="24" />
+ <ellipse cx="36" cy="36" fill="black" rx="27" ry="21" />
+
+ <ellipse cx="36" cy="36" fill="white" rx="24" wry="24" />
+ <ellipse cx="36" cy="36" fill="black" rx="21" ry="21" />
+ </mask>
+
+ <rect fill="#FFFFFF" mask="url(#glyph)" height="100%" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/glyph/bzipper.svg b/svg/glyph/bzipper.svg
new file mode 100644
index 0000000..7670c3a
--- /dev/null
+++ b/svg/glyph/bzipper.svg
@@ -0,0 +1,8 @@
+<svg height="72" width="72" xmlns="http://www.w3.org/2000/svg">
+ <mask id="glyph">
+ <polyline fill="none" points="4,12 4,4 62,4 18.970562748,60" stroke="white" stroke-linecap="round" stroke-linejoin="round" stroke-width="8" />
+ <polyline fill="none" points="60,52 60,60 4,60 43.029437252,4" stroke="white" stroke-linecap="round" stroke-linejoin="round" stroke-width="8" />
+ </mask>
+
+ <rect fill="#B4202D" height="100%" mask="url(#glyph)" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/glyph/eas.svg b/svg/glyph/eas.svg
new file mode 100644
index 0000000..8faa8b7
--- /dev/null
+++ b/svg/glyph/eas.svg
@@ -0,0 +1,15 @@
+<svg height="72" width="72" xmlns="http://www.w3.org/2000/svg">
+ <mask id="strike">
+ <circle cx="36" cy="36" fill="white" r="30" />
+ <polygon fill="black" points="72,0 72,72 0,72" />
+ </mask>
+
+ <mask id="glyph">
+ <circle cx="36" cy="36" fill="white" r="36" />
+ <circle cx="36" cy="36" fill="black" r="24" />
+ <polygon fill="black" points="72,0 72,36 36,36" />
+ <polyline mask="url(#strike)" points="72,0 0,72" stroke="white" stroke-width="24" />
+ </mask>
+
+ <rect fill="#00291B" height="100%" mask="url(#glyph)" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/glyph/luma.svg b/svg/glyph/luma.svg
new file mode 100644
index 0000000..a06c92a
--- /dev/null
+++ b/svg/glyph/luma.svg
@@ -0,0 +1,19 @@
+<svg height="112" width="112" xmlns="http://www.w3.org/2000/svg">
+ <mask id="glyph">
+ <polygon points="0,0 16,0 16,32 48,32 48,48 8,48 0,40" fill="white" />
+ <circle cx="8" cy="40" fill="white" r="8" />
+
+ <polygon points="64,0 80,0 80,32 96,32 96,0 112,0 112,40 104,48 72,48 64,40" fill="white" />
+ <circle cx="72" cy="40" fill="white" r="8" />
+ <circle cx="104" cy="40" fill="white" r="8" />
+
+ <polygon points="0,64 48,64 0,112" fill="white" />
+ <polygon points="24,88 48,88 48,112" fill="white" />
+
+ <polygon points="72,64 104,64 112,72 112,112 96,112 96,80 80,80 80,112 64,112 64,72" fill="white" />
+ <circle cx="72" cy="72" fill="white" r="8" />
+ <circle cx="104" cy="72" fill="white" r="8" />
+ </mask>
+
+ <rect fill="#FFFFFF" height="100%" mask="url(#glyph)" width="100%" x="0" y="0" />
+</svg>
diff --git a/svg/glyph/pollex.svg b/svg/glyph/pollex.svg
new file mode 100644
index 0000000..51b2478
--- /dev/null
+++ b/svg/glyph/pollex.svg
@@ -0,0 +1,28 @@
+<svg height="80" width="224" xmlns="http://www.w3.org/2000/svg">
+ <mask id="glyph">
+ <polygon fill="white" points="0,0 52,0 52,24 16,24 16,32 0,32" />
+ <circle cx="52" cy="12" fill="white" r="12" />
+
+ <polygon fill="black" points="16,8 44,8 44,16 16,16" />
+ <circle cx="44" cy="12" fill="black" r="4" />
+
+ <polygon fill="white" points="88,0 136,0 144,8 144,24 136,32 88,32 80,24 80,8" />
+ <circle cx="88" cy="8" fill="white" r="8" />
+ <circle cx="136" cy="8" fill="white" r="8" />
+ <circle cx="136" cy="24" fill="white" r="8" />
+ <circle cx="88" cy="24" fill="white" r="8" />
+
+ <polygon fill="black" points="96,8 128,8 128,24 96,24" />
+
+ <polygon fill="white" points="160,0 176,0 176,24 224,24 224,32 160,32" />
+
+ <polygon fill="white" points="0,48 16,48 16,72 64,72 64,80 0,80" />
+
+ <polygon fill="white" points="80,48 144,48 144,56 96,56 96,60 128,60 128,68 96,68 96,72 144,72 144,80 80,80" />
+
+ <polygon fill="white" points="160,48 176,48 224,80 208,80" />
+ <polygon fill="white" points="208,48 224,48 176,80 160,80" />
+ </mask>
+
+ <rect fill="#FFFFFF" height="100%" mask="url(#glyph)" width="100%" x="0" y="0" />
+</svg>