Icons, colors, homepage design

assets/icon.less

@@ -0,0 +1,19 @@
+@font-face {
+  font-family: "tabler-icons";
+  font-style: normal;
+  font-weight: 400;
+  src: url('/public/tabler.231017.woff2') format('woff2');
+}
+
+.icon {
+  font-family: "tabler-icons";
+  font-style: normal;
+  font-weight: 400;
+  font-variant: normal;
+  text-transform: none;
+  text-decoration: none;
+  line-height: 1;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  speak: none;
+}

assets/index.less

@@ -1 +1,37 @@
-body {}
+body {
+  margin: 0;
+  padding: 0;
+  height: 100vh;
+  background: var(--gradient);
+}
+
+main {
+  height: 100%;
+
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+
+  gap: 0.5rem;
+}
+
+.logo {
+  @size: 4rem;
+
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+
+  .logo-text {
+    font-size: @size;
+    font-weight: 400;
+    font-family: "Ubuntu";
+    text-transform: uppercase;
+  }
+
+  .logo-hex {
+    font-size: @size;
+    user-select: none;
+  }
+}

assets/theme.less

@@ -0,0 +1,26 @@
+.theme-mixin(@light: bool) {
+  @bg: if(@light, #e8e8ff, #181822);
+  @fg: if(@light, #111111, #eeeeee);
+  @mult: if(@light, 0.75, 2.75);
+
+  --bg: @bg;
+  --fg: @fg;
+  --color1: hsl(hue(@bg), saturation(@bg) * @mult, lightness(@bg) * @mult);
+  --color2: hsl(hue(@bg) + 40, saturation(@bg) * @mult, lightness(@bg) * @mult);
+  --gradient: linear-gradient(135deg, var(--color1) 0%, var(--bg) 25%, var(--bg) 75%, var(--color2) 100%);
+}
+
+body {
+  .theme-mixin(true);
+
+  @media (prefers-color-scheme: dark) {
+    .theme-mixin(false);
+  }
+
+  &.dark {
+    .theme-mixin(false);
+  }
+
+  background: var(--bg);
+  color: var(--fg);
+}