diff --git a/.nojekyll b/.nojekyll new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/.nojekyll @@ -0,0 +1 @@ + diff --git a/README.md b/README.md new file mode 100644 index 0000000..b740482 --- /dev/null +++ b/README.md @@ -0,0 +1,23 @@ +# Hebb Docs + +Public landing page and documentation home for the Hebb project. + +This repo is intentionally static for the first pass so it can be hosted by +GitHub Pages without a build step. + +## Local preview + +```bash +python3 -m http.server 4173 +``` + +Open . + +## Deploy on GitHub Pages + +Use repository settings: + +- Source: `Deploy from a branch` +- Branch: `main` +- Folder: `/ (root)` + diff --git a/assets/logo.png b/assets/logo.png new file mode 100644 index 0000000..6920e2f Binary files /dev/null and b/assets/logo.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..26f80c0 --- /dev/null +++ b/index.html @@ -0,0 +1,147 @@ + + + + + + + Hebb + + + + + + +
+
+
+

Open-source neural substrate

+

Build systems that learn as streams of events.

+

+ Hebb combines a Rust spiking-network core, Python bindings, and a + local-first visualizer for exploring graph-shaped memory, + plasticity, and brain-inspired AI architectures. +

+ +
+ +
+ +
+
+ +
+
+

Platform

+

One project, two public surfaces.

+
+
+
+ App +

Hebb desktop

+

+ A local-first Tauri app and web visualizer for opening cortex + folders, watching spikes propagate, and inspecting learned + structure. +

+ github.com/hebb-project/hebb +
+
+ Library +

Hebb core

+

+ A pure-Rust spiking-neural-network substrate with optional disk + format support and Python bindings for research workflows. +

+ github.com/hebb-project/hebb_core +
+
+
+
+ + + +
+
+
+ + + +
+ +
+ + + + +
+
+
+ Replace this frame with a desktop screenshot once the public demo + capture is ready. +
+
+
+ +
+
+

Docs

+

Public documentation will live here.

+
+ +
+
+ + + + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..000204e --- /dev/null +++ b/styles.css @@ -0,0 +1,610 @@ +:root { + --bg: #080a0f; + --bg-soft: #0d1117; + --panel: #101620; + --panel-2: #0b1017; + --line: #213040; + --line-soft: #17212d; + --text: #edf6fa; + --muted: #9da9b5; + --muted-2: #6f7c89; + --cyan: #7df9ff; + --cyan-soft: rgba(125, 249, 255, 0.14); + --pink: #ff5d8f; + --purple: #b794f6; + --green: #9ff2bf; + --shadow: rgba(0, 0, 0, 0.35); +} + +* { + box-sizing: border-box; +} + +html { + background: var(--bg); + color: var(--text); + font-family: + Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", + sans-serif; + line-height: 1.5; + scroll-behavior: smooth; +} + +body { + margin: 0; + min-height: 100vh; + background: + radial-gradient(circle at 20% 8%, rgba(125, 249, 255, 0.1), transparent 28rem), + radial-gradient(circle at 80% 0%, rgba(255, 93, 143, 0.08), transparent 26rem), + linear-gradient(180deg, #090d13 0%, var(--bg) 48%, #07090d 100%); +} + +a { + color: inherit; + text-decoration: none; +} + +.site-header { + align-items: center; + border-bottom: 1px solid var(--line-soft); + display: flex; + height: 72px; + justify-content: space-between; + margin: 0 auto; + max-width: 1180px; + padding: 0 24px; +} + +.brand { + align-items: center; + display: inline-flex; + font-size: 18px; + font-weight: 650; + gap: 10px; + letter-spacing: 0; +} + +.brand img { + height: 34px; + width: 34px; +} + +.site-nav { + align-items: center; + color: var(--muted); + display: flex; + font-size: 14px; + gap: 22px; +} + +.site-nav a:hover { + color: var(--cyan); +} + +main { + margin: 0 auto; + max-width: 1180px; + padding: 0 24px 56px; +} + +.hero { + align-items: center; + display: grid; + gap: 48px; + grid-template-columns: minmax(0, 1fr) 430px; + min-height: calc(100vh - 72px); + padding: 72px 0 88px; +} + +.hero-copy { + max-width: 720px; +} + +.eyebrow { + color: var(--cyan); + font-size: 12px; + font-weight: 700; + letter-spacing: 0.13em; + margin: 0 0 14px; + text-transform: uppercase; +} + +h1, +h2, +h3, +p { + margin-top: 0; +} + +h1 { + font-size: clamp(46px, 7vw, 88px); + font-weight: 700; + letter-spacing: 0; + line-height: 0.96; + margin-bottom: 24px; + max-width: 860px; +} + +h2 { + font-size: clamp(30px, 4vw, 48px); + font-weight: 680; + letter-spacing: 0; + line-height: 1.04; + margin-bottom: 0; +} + +h3 { + font-size: 22px; + line-height: 1.18; + margin-bottom: 12px; +} + +.lede { + color: var(--muted); + font-size: 20px; + max-width: 690px; +} + +.hero-actions { + display: flex; + flex-wrap: wrap; + gap: 12px; + margin-top: 34px; +} + +.button { + align-items: center; + border: 1px solid var(--line); + border-radius: 8px; + display: inline-flex; + font-size: 15px; + font-weight: 650; + min-height: 46px; + padding: 0 18px; + transition: + border-color 160ms ease, + background 160ms ease, + color 160ms ease, + transform 160ms ease; +} + +.button:hover { + transform: translateY(-1px); +} + +.button.primary { + background: var(--cyan); + border-color: var(--cyan); + color: #041116; +} + +.button.secondary { + background: rgba(16, 22, 32, 0.72); + color: var(--text); +} + +.button.secondary:hover { + border-color: rgba(125, 249, 255, 0.5); + color: var(--cyan); +} + +.hero-symbol { + align-items: center; + aspect-ratio: 1; + background: + radial-gradient(circle at 50% 50%, rgba(125, 249, 255, 0.1), transparent 42%), + rgba(16, 22, 32, 0.36); + border: 1px solid rgba(125, 249, 255, 0.12); + border-radius: 50%; + display: grid; + justify-items: center; + position: relative; +} + +.hero-symbol::before, +.hero-symbol::after { + border: 1px solid rgba(125, 249, 255, 0.08); + border-radius: 50%; + content: ""; + inset: 13%; + position: absolute; +} + +.hero-symbol::after { + border-color: rgba(255, 93, 143, 0.07); + inset: 28%; +} + +.network-mark { + height: 300px; + position: relative; + width: 300px; +} + +.mark-node, +.mark-edge { + display: block; + position: absolute; +} + +.mark-node { + background: #0b1017; + border: 2px solid rgba(125, 249, 255, 0.82); + border-radius: 999px; + box-shadow: + 0 0 0 12px rgba(125, 249, 255, 0.05), + 0 0 28px rgba(125, 249, 255, 0.24); + height: 38px; + width: 38px; + z-index: 2; +} + +.mn1 { + left: 35px; + top: 130px; +} + +.mn2 { + border-color: rgba(255, 93, 143, 0.9); + box-shadow: + 0 0 0 12px rgba(255, 93, 143, 0.06), + 0 0 28px rgba(255, 93, 143, 0.26); + left: 130px; + top: 42px; +} + +.mn3 { + left: 217px; + top: 130px; +} + +.mn4 { + border-color: rgba(183, 148, 246, 0.9); + box-shadow: + 0 0 0 12px rgba(183, 148, 246, 0.06), + 0 0 28px rgba(183, 148, 246, 0.22); + left: 95px; + top: 222px; +} + +.mn5 { + left: 196px; + top: 222px; +} + +.mark-edge { + background: rgba(125, 249, 255, 0.3); + height: 2px; + transform-origin: left center; + z-index: 1; +} + +.me1 { + left: 71px; + top: 139px; + transform: rotate(-42deg); + width: 126px; +} + +.me2 { + background: rgba(255, 93, 143, 0.34); + left: 164px; + top: 73px; + transform: rotate(42deg); + width: 122px; +} + +.me3 { + background: rgba(183, 148, 246, 0.34); + left: 120px; + top: 232px; + transform: rotate(-31deg); + width: 118px; +} + +.me4 { + left: 234px; + top: 163px; + transform: rotate(72deg); + width: 84px; +} + +.section { + padding: 76px 0; +} + +.section-heading { + display: flex; + justify-content: space-between; + gap: 28px; + margin-bottom: 28px; +} + +.platform-grid { + display: grid; + gap: 16px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + margin-bottom: 28px; +} + +.platform-grid article { + background: rgba(16, 22, 32, 0.72); + border: 1px solid var(--line); + border-radius: 10px; + padding: 24px; +} + +.card-label { + color: var(--pink); + display: block; + font-family: ui-monospace, "SF Mono", Menlo, monospace; + font-size: 12px; + margin-bottom: 36px; +} + +.platform-grid p { + color: var(--muted); + max-width: 520px; +} + +.platform-grid a { + color: var(--cyan); + font-size: 14px; +} + +.desktop-shot { + background: + linear-gradient(180deg, rgba(16, 22, 32, 0.86), rgba(8, 10, 15, 0.92)), + var(--panel); + border: 1px solid var(--line); + border-radius: 14px; + box-shadow: 0 24px 80px var(--shadow); + margin: 0; + overflow: hidden; +} + +.shot-topbar { + align-items: center; + border-bottom: 1px solid var(--line-soft); + display: flex; + gap: 8px; + height: 38px; + padding: 0 16px; +} + +.shot-topbar span { + background: var(--line); + border-radius: 999px; + height: 8px; + width: 8px; +} + +.shot-canvas { + display: grid; + grid-template-columns: 220px minmax(0, 1fr) 220px; + min-height: 470px; +} + +.shot-sidebar, +.shot-inspector { + background: rgba(11, 16, 23, 0.72); + border-right: 1px solid var(--line-soft); + padding: 22px; +} + +.shot-inspector { + border-left: 1px solid var(--line-soft); + border-right: 0; +} + +.shot-sidebar span, +.shot-inspector span { + background: rgba(157, 169, 181, 0.14); + border-radius: 6px; + display: block; + height: 38px; + margin-bottom: 12px; +} + +.shot-sidebar span:first-child, +.shot-inspector span:first-child { + background: rgba(125, 249, 255, 0.12); +} + +.shot-network { + min-height: 470px; + position: relative; +} + +.shot-node, +.shot-edge { + display: block; + position: absolute; +} + +.shot-node { + background: #0b1017; + border: 2px solid rgba(125, 249, 255, 0.78); + border-radius: 999px; + box-shadow: + 0 0 0 16px rgba(125, 249, 255, 0.045), + 0 0 32px rgba(125, 249, 255, 0.24); + height: 42px; + width: 42px; + z-index: 2; +} + +.sn1 { left: 18%; top: 32%; } +.sn2 { left: 48%; top: 22%; border-color: rgba(255, 93, 143, 0.86); box-shadow: 0 0 0 16px rgba(255, 93, 143, 0.05), 0 0 32px rgba(255, 93, 143, 0.22); } +.sn3 { left: 68%; top: 52%; } +.sn4 { left: 36%; top: 70%; border-color: rgba(183, 148, 246, 0.86); box-shadow: 0 0 0 16px rgba(183, 148, 246, 0.05), 0 0 32px rgba(183, 148, 246, 0.2); } + +.shot-edge { + background: rgba(125, 249, 255, 0.28); + height: 2px; + transform-origin: left center; +} + +.se1 { left: 23%; top: 36%; transform: rotate(-13deg); width: 210px; } +.se2 { left: 54%; top: 29%; transform: rotate(43deg); width: 180px; background: rgba(255, 93, 143, 0.3); } +.se3 { left: 41%; top: 73%; transform: rotate(-32deg); width: 245px; background: rgba(183, 148, 246, 0.3); } + +.desktop-shot figcaption { + border-top: 1px solid var(--line-soft); + color: var(--muted-2); + font-size: 13px; + margin: 0; + padding: 14px 18px 16px; + text-align: center; +} + +.split { + align-items: start; + border-top: 1px solid var(--line-soft); + display: grid; + gap: 42px; + grid-template-columns: 0.85fr 1.15fr; +} + +.doc-list { + border: 1px solid var(--line); + border-radius: 10px; + overflow: hidden; +} + +.doc-list a { + background: rgba(16, 22, 32, 0.58); + border-bottom: 1px solid var(--line-soft); + display: block; + padding: 20px 22px; +} + +.doc-list a:last-child { + border-bottom: 0; +} + +.doc-list a:hover { + background: rgba(125, 249, 255, 0.06); +} + +.doc-list span { + display: block; + font-size: 17px; + font-weight: 650; + margin-bottom: 4px; +} + +.doc-list small { + color: var(--muted); + font-size: 14px; +} + +.site-footer { + align-items: center; + border-top: 1px solid var(--line-soft); + color: var(--muted-2); + display: flex; + flex-wrap: wrap; + font-size: 13px; + gap: 18px; + justify-content: center; + margin: 0 auto; + max-width: 1180px; + padding: 26px 24px 40px; +} + +.site-footer a { + color: var(--muted); +} + +@media (max-width: 880px) { + .site-header { + height: auto; + min-height: 68px; + } + + .site-nav { + gap: 14px; + } + + .hero, + .split { + grid-template-columns: 1fr; + } + + .hero { + min-height: auto; + padding-top: 56px; + } + + .platform-grid { + grid-template-columns: 1fr; + } + + .shot-canvas { + grid-template-columns: 1fr; + min-height: 520px; + } + + .shot-sidebar, + .shot-inspector { + display: none; + } + + .shot-network { + min-height: 520px; + } +} + +@media (max-width: 560px) { + .site-header { + align-items: flex-start; + flex-direction: column; + gap: 12px; + padding-bottom: 16px; + padding-top: 16px; + } + + main { + padding-left: 18px; + padding-right: 18px; + } + + h1 { + font-size: 46px; + } + + .lede { + font-size: 18px; + } + + .button { + justify-content: center; + width: 100%; + } + + .hero-symbol { + margin: 0 auto; + max-width: 340px; + } + + .network-mark { + height: 250px; + transform: scale(0.82); + width: 250px; + } + + .shot-canvas, + .shot-network { + min-height: 360px; + } + + .shot-node { + height: 34px; + width: 34px; + } + + .desktop-shot figcaption { + display: none; + } +}