obsidian-plugin/dustinkeeton_obsidian-synapse
1
0
Fork 0
mirror of https://github.com/dustinkeeton/obsidian-synapse.git synced 2026-07-22 07:44:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: brand refresh — Iris + Gold (2026)

Browse source 
Adopt the replaced assets/brand kit across the plugin and repo:

- Regenerate src/brand-icons.ts from the new assets: glyph bodies stay
  currentColor, each may carry ONE gold gesture via
  var(--synapse-gold, #FFD23F); synapse-actions is now the S-Signal at
  glyph weight (brain retired), synapse-main stays impulse-free.
- Relax the brand-icons test color rule: the gold var's canonical
  fallback is the only hex a glyph may bake.
- Theme the gold in styles.css (#FFD23F, deepened to #E8B419 on
  .theme-light for contrast on white).
- README: hero uses banner-animated.svg (SMIL spike draw-on); sponsor
  badges move from the retired violets to Iris/Gold. Same palette note
  updated in the donation plan doc.
- Restore the SMIL animations that were stripped from the delivered
  banner-animated.svg and accept-flash.svg (reconstructed from the
  accept-flash.md spec; scaffolding was intact, animate nodes missing).
- Re-rasterize social-preview.png (1280x640, 679 KB) from the new SVG.
- Sync package-lock version to 1.0.10 (validated with npm@10 ci).

Log the palette/exception decision in DECISIONS.md.

Co-Authored-By: Claude <bot@wafflenet.io>
This commit is contained in:
bot 2026-07-02 12:05:37 -07:00
parent 01b2dc8472
commit 0831fc4b37
No known key found for this signature in database
31 changed files with 359 additions and 265 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
DECISIONS.md
View file

@ -4,6 +4,22 @@ Decisions listed in reverse chronological order.
---
## 2026-07-02: Brand refresh — Iris + Gold; glyphs may carry ONE gold gesture via a theme var
**Context**: The brand kit in `assets/brand/` was replaced (2026 Iris + Gold refresh): body color moves from violet `#8b5cf6` to Iris `#5A3EF0`, volt lime `#CCFF00` is retired, and the "impulse" — the one thing Synapse adds — is now always Gold `#FFD23F`. The in-app glyphs previously had a hard rule: pure `currentColor`, never a baked color (`brand-icons.test.ts` failed on any `#`). The new glyph grammar puts the single gold gesture *inside* the glyphs, which that rule forbade.
**Decision**: Glyph bodies stay `currentColor` (host UI supplies the ink), but each glyph may carry **one** gold gesture expressed only as `style="…var(--synapse-gold, #FFD23F)"`. The var is themed in `styles.css` (`body { --synapse-gold: #FFD23F }`, deepened to `#E8B419` on `.theme-light` for contrast on white). The test now strips the exact token `var(--synapse-gold, #FFD23F)` before asserting no `#` remains, so the canonical fallback is the *only* hex a glyph can bake. `synapse-main` stays impulse-free (neutral fallback); `synapse-actions` becomes the S-Signal at glyph weight (the brain mark is retired; the neuron remains the proposals mark).
**Alternatives considered**:
- **Keep glyphs pure `currentColor`** — rejected; the refresh's whole grammar is "gold = what Synapse adds", and a mono glyph set can't say that.
- **Bake `#FFD23F` directly** — rejected; light themes need the deepened `#E8B419`, and a literal hex can't retheme.
**Rationale**: The CSS var keeps one retunable source of truth per surface while the fallback keeps the assets self-contained (they render correctly outside Obsidian, e.g. on GitHub).
**Impact**: `assets/brand/*` (all marks + glyphs), `src/brand-icons.ts` (regenerated bodies), `brand-icons.test.ts` (color rule), `styles.css` (gold tokens), README hero (animated banner) + sponsor badges (Iris/Gold). No behavior change beyond visuals.
---
## 2026-06-29: Raw caught errors get the same redaction as strings (`redactError`)
**Context**: `redactSecrets()` — the single redaction source (`shared/redact.ts`) — only operates on **strings**. Several console sinks log a caught value directly (`console.warn('…failed', err)` / `console.error('…', err)`), handing the bare `Error` object — and its `.stack`, which embeds `.message` — to the console. A secret echoed into an error message by an upstream API or a thrown exception would reach the console **verbatim**, bypassing redaction. This audit found five such raw-error sinks across audio, rem, elaboration, and shared.

6
README.md
View file

@ -1,5 +1,5 @@
<p align="center">
<img src="assets/brand/banner.svg" alt="Synapse — More connections. Brighter thoughts." width="100%">
<img src="assets/brand/banner-animated.svg" alt="Synapse — More connections. Brighter thoughts." width="100%">
</p>
# Synapse
@ -416,8 +416,8 @@ Then run `npm run dev` to rebuild automatically on changes. Reload Obsidian (Cmd
Synapse is free and open source. If it has earned a place in your workflow,
you can support continued development:
[![Sponsor on GitHub](https://img.shields.io/badge/Sponsor-GitHub-8b5cf6?logo=github)](https://github.com/sponsors/dustinkeeton)
[![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-5b21b6?logo=buymeacoffee&logoColor=white)](https://www.buymeacoffee.com/dustinkeeton)
[![Sponsor on GitHub](https://img.shields.io/badge/Sponsor-GitHub-5A3EF0?logo=github)](https://github.com/sponsors/dustinkeeton)
[![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-FFD23F?logo=buymeacoffee&logoColor=0A0718)](https://www.buymeacoffee.com/dustinkeeton)
## License

107
assets/brand/README.md
View file

@ -1,90 +1,47 @@
# Synapse brand assets
# Synapse brand kit — Iris + Gold (2026 refresh)
Canonical visual assets for Synapse. The full brand guidelines — palette, typography, voice/tone, name treatment, and mark usage rules — live in [`.claude/skills/brand-guidelines/SKILL.md`](../../.claude/skills/brand-guidelines/SKILL.md); read that before using or modifying anything here.
Drop-in replacement for `assets/brand/`. The S is now **fired**: an action-potential spike in gold slashes the synaptic cleft of the iris S. One system, two tiers.
## Inventory
## Palette
| Asset | Description | Use for |
|-------|-------------|---------|
| `icon.svg` | "The S-Signal" mark — 256×256 viewBox, transparent background, flat palette colors only | Plugin icon contexts, avatars, favicons, anywhere square **above ~24px** |
| `icon-small.svg` | Optical-size cut of the S-Signal — 256×256 viewBox, transparent, flat palette only. Widened cleft, enlarged volt bead on a thinned Gap Black chip, plain open receptor terminal (ring dropped) | Renders **at or below ~24px**: 16px favicons, 16–24px list/UI icons |
| `icon-mono.svg` | In-app **proposals** identity mark — a single-color `currentColor` **neuron** (dendrites → filled soma → axon carrying one impulse) on a **`0 0 100 100` viewBox**, no palette colors. Registered as the `synapse` icon by `registerSynapseIcons()` (`src/brand-icons.ts`), kept byte-synced with this file's inner content. Intentionally diverges from the S-Signal — see [In-app neuron/brain marks](#in-app-neuronbrain-marks) | Color-stripping surfaces: Obsidian ribbon/UI (the `synapse` icon), and any monochrome context |
| `glyphs/*.svg` | The Synapse **UI glyph set** — 13 mono `currentColor` icons on **`0 0 100 100` viewBox**, flat, no palette colors. Feature/action glyphs for the Synapse Actions sidebar and commands (see [Glyph set](#glyph-set-glyphs) below) | Registered via `registerSynapseIcons()` in `src/brand-icons.ts`; rendered by the host UI and feature-tinted in the Synapse Actions sidebar |
| `icon-accepted.svg` | **Accept-state** cut of the S-Signal — 256×256, transparent, flat palette only. The cleft is bridged in violet (gap jumped) and the single Impulse Volt spark has **landed in the receptor**, now closed/filled instead of an open ring | The **accepted** outcome of a proposal: accept-button confirmation, accepted-link badges, the end frame of the accept-flash. Pairs with `icon.svg` (open) — not the default identity. Use **above ~24px** |
| `banner.svg` | README hero — 1280×320, self-contained dark background, mark + wordmark + tagline | Top of README; safe on both GitHub light and dark themes |
| `social-preview.svg` / `social-preview.png` | GitHub social preview (og:image) — 1280×640 full-bleed dark, hero-scale mark + wordmark + "for Obsidian" + standing tagline; PNG is the uploadable render (<1 MB) | Repo Settings → Social preview; link unfurls (Slack/Discord/X). Critical ink stays ≥64px from edges (client crops/rounding). Not for the README (that is `banner.svg`); don't crop or overlay text |
| Role | Value | Use |
|------|-------|-----|
| Iris | `#5A3EF0` | Brand body (arcs, soma, receptor), UI accents |
| Gold | `#FFD23F` | The impulse — the only color Synapse insists on everywhere |
| Gold (light surfaces) | `#E8B419` | Same hue, deepened for contrast on white |
| Ground | `#0A0718` | Brand dark; also the spike's chip on light backgrounds |
| Ion | `#F3F0FF` | Text on dark |
| Lilac | `#B7A8FF` | Secondary text on dark |
| App body | `currentColor` | In-app marks/glyphs inherit the theme's ink |
### Size cutover: canonical vs small cut
**Volt lime (`#CCFF00`) is retired.** The old violet `#8b5cf6` is superseded by Iris.
Use **`icon.svg`** above ~24px and **`icon-small.svg`** at ~24px and below. Below ~24px the canonical spark — the firing moment that carries the whole brand story — merges into the S spine and disappears. `icon-small.svg` deliberately sacrifices letterform polish (wider cleft, fatter bead, plainer receptor) to keep one clearly visible lime point in the gap down to 16px. Above ~24px that trade is unnecessary and the canonical mark's full directional comet and open receptor ring read cleanly — use it there.
## Two tiers
Both color variants are for surfaces that **keep** color. For surfaces that strip it, use `icon-mono.svg` (below).
- **Identity tier** (README, social, store, avatars): full-color marks — `icon.svg`, `icon-small.svg` (≤24px), `icon-accepted.svg`, `banner.svg` / `banner-animated.svg`, `social-preview.svg`.
- **Theme tier** (ribbon, sidebars, commands): `icon-mono.svg` + `glyphs/` — body is `currentColor`, impulse is `var(--synapse-gold, #FFD23F)`. Define in `styles.css`:
### Monochrome in-app marks (`icon-mono.svg`, `glyphs/synapse-actions.svg`)
```css
body { --synapse-gold: #FFD23F; }
.theme-light { --synapse-gold: #E8B419; }
```
Obsidian's ribbon and UI render icons as a single `currentColor` silhouette — gradients and palette colors are discarded. `icon-mono.svg` (the `synapse` proposals mark, now a **neuron**) and `glyphs/synapse-actions.svg` (the actions launcher, a **brain**) are built for exactly that: every stroke and fill is `currentColor`, so the host UI's text color drives them (Ion White on dark, Gap Black on white — verified on both). Both carry a single round-capped **impulse** and **intentionally diverge from the canonical S-Signal** (see [In-app neuron/brain marks](#in-app-neuronbrain-marks)); they are no longer mono cuts of it.
## The glyph grammar (Topology)
They are authored on a **`0 0 100 100`** viewBox (not the family's 256) because that is Obsidian's `addIcon` convention — each file's inner content is the literal string registered by `registerSynapseIcons()` in `src/brand-icons.ts`. **Keep them in sync:** if you edit an asset, update its registered body (and vice-versa); `brand-icons.test.ts` fails on drift. Use these only on color-stripping or monochrome surfaces; anywhere color survives, use `icon.svg` / `icon-small.svg`.
Soma (filled) = what exists · ring (open) = what's proposed · line = connection · **gold = what Synapse adds** (the act, or on Enrich, the added metadata). Verb → shape: expand=fan · attach=gold leaves · condense=merge · file=tree · run-all=cascade · examine=dive · format=wave→line · link=bridge.
### Glyph set (`glyphs/`)
The `glyphs/` folder holds the **Synapse UI glyph set**: 13 monochrome `currentColor` icons, one per feature/action, authored on the same **`0 0 100 100`** viewBox as `icon-mono.svg`. Their inner content is registered via **`registerSynapseIcons()` in `src/brand-icons.ts`** (alongside the `synapse` body, which stays byte-synced with `icon-mono.svg`). The host UI supplies the color, and the **Synapse Actions sidebar tints each glyph per feature** (elaboration→blue, enrichment→green, organize→orange, deep-dive→purple, rem→pink, summarize→red, tidy→orange, video→yellow, main→muted). Never bake palette colors in — they are `currentColor` only.
| Glyph | Subject |
|-------|---------|
| `synapse-elaboration` | Stub note + lines growing outward (expand a stub into a full note) |
| `synapse-enrichment` | Note + short connector stubs ending in open terminals (attach metadata) |
| `synapse-organize` | A note filed into a folder |
| `synapse-deep-dive` | Note + magnifier penetrating the page (examine one note in depth) |
| `synapse-summarize` | Lines condensing inward into a note (mirror of elaboration) |
| `synapse-tidy` | A note whose ragged lines resolve to flush-aligned (normalize/align) |
| `synapse-rem` | Two notes (filled source + outlined relation) joined by one link |
| `synapse-video` | Media panel + play triangle (external media/tooling) |
| `synapse-main` | A plain note — neutral fallback, deliberately low-energy |
| `synapse-transcribe` | Audio waveform + note (sound → linked text; also the Transcribe ribbon) |
| `synapse-fire` | A folder with one bold arrow sweeping through it (run all features over a directory) |
| `synapse-checkpoints` | Resume triangle + a broken ring (manage/resume interrupted runs) |
| `synapse-actions` | A **brain** with one impulse across it (the Synapse actions launcher / command center) |
These are line/silhouette glyphs that share one system: a ~76×76 live area, a single stroke weight (~8 at the artboard), round caps and joins throughout, one consistent rounded-rect radius for panels/folders, and **one canonical note shape** (a rounded portrait page) used identically wherever a note appears. Solid fill marks the single *subject* of each action; everything else is outlined. **Exception:** `synapse-actions` is now a **brain** in-app identity mark carrying one impulse (see [In-app neuron/brain marks](#in-app-neuronbrain-marks)); the other twelve glyphs stay impulse-free and contain no spark, cleft, or "S".
### Accept-state variant (`icon-accepted.svg`)
The canonical mark encodes the proposal-approval safety model as geometry: the impulse jumps toward an **open, unfilled receptor ring** — a proposed connection, not yet accepted. `icon-accepted.svg` is that mark resolved to the moment of **accept**: the charged cleft is bridged in Synapse Violet (the gap has been jumped — the connection is made) and the single Impulse Volt spark has **landed in the receptor**, which is now **closed/filled** instead of an open ring. The spark sheds its directional comet taper and settles into a round bead at rest, seated in the receptor with its Gap Black chip intact so the lime survives on white.
It is still **one volt element** — the landed bead is the only lime in the composition. Use it only to show the **accepted** outcome (accept-button confirmation, accepted-link badge, the end frame of the accept-flash); it is a state *pair* with `icon.svg` (open/proposed), **not** a replacement default identity. Size it like the canonical mark — **above ~24px**; it has no dedicated small cut.
The **open → closed motion spec** (the accept-flash) lives in the brand guidelines under *Accept-flash motion spec*: timing, what the single volt element does frame-to-frame, how the receptor fills, the explicit one-volt-rule compliance, and the no-glow/no-blur rule. It is spec only — not wired into any UI.
## The mark in one sentence
An "S" traced by a neural impulse: two violet synaptic arcs broken by a charged cleft, one Impulse Volt spark (`#CCFF00`) firing left-to-right across the gap, from a filled source ball toward an open receptor ring that closes only on accept.
Exceptions: `synapse-main` is deliberately impulse-free (neutral fallback). `synapse-actions` is the S itself at glyph weight — the brain is retired; the neuron (`icon-mono`) remains the proposals mark.
## Hard rules
- Use only palette colors (see guidelines). Never recolor the mark or detach the spark. **Exception:** `icon-mono.svg` and everything in `glyphs/` are intentionally single-color `currentColor` — no palette colors, no lime accent, no Gap Black chip. They are the color-agnostic variants; the rules below about the volt spark and its chip do not apply to them.
- **Impulse on the in-app identity marks only.** `synapse` (`icon-mono.svg`, neuron) and `synapse-actions` (brain) each carry one round-capped impulse; no other `glyphs/` icon may contain a spark, lime, cleft, or an "S" silhouette.
- **One volt element per composition** — the spark is the only bright accent, ever.
- On white backgrounds the spark keeps its Gap Black outline/chip; never remove it.
- The mark is flat — no glows, blurs, drop shadows, or gradients in the mark itself.
- Don't place text over the banner or crop it.
- One gold gesture per composition (Enrich's leaf set counts as one gesture).
- On white, the identity spike keeps its Ground chip; never remove it.
- Flat only — no glows, blurs, shadows; gradients allowed on backgrounds, never in the mark.
- Use `icon-small.svg` at or below ~24px; the canonical spike merges below that.
- Keep `glyphs/` byte-synced with `registerSynapseIcons()` in `src/brand-icons.ts`.
## Verifying changes
## Notes
Assets are hand-written SVG. After any edit, render and inspect before committing (macOS, no dependencies):
```sh
qlmanage -t -s 1024 -o /tmp <asset>.svg # writes /tmp/<asset>.svg.png — open and check
```
Check dark (`#131019`) and white backgrounds, plus a ~48px copy for small-size legibility. For the `glyphs/` set, **16px is the design size** — render each glyph at ~16px *and* ~48px on both backgrounds and confirm crisp single-color legibility; reduce detail (never thin strokes below ~6.25 at the 100 artboard) if a glyph muddies at 16px. The `designer` agent (`.claude/agents/designer.md`) does this loop automatically.
## Wanted (not yet produced)
- _Nothing currently open. The UI glyph set (`glyphs/`), the accept-state variant (`icon-accepted.svg`), and the accept-flash motion spec are done; see above._
## In-app neuron/brain marks
> **In-app neuron/brain marks (divergent from the S-Signal).** `icon-mono.svg` (the `synapse` glyph) and `glyphs/synapse-actions.svg` are now in-app identity marks drawn around a **neuron** (proposals) and a **brain** (the actions launcher / command center), each carrying a single round-capped impulse. They **intentionally diverge from the canonical S-Signal** — they are no longer mono cuts of it. The full-color S-Signal family (`icon.svg`, `icon-small.svg`, `icon-accepted.svg`, `banner.svg`, `social-preview.*`) is unchanged and remains the canonical identity.
>
> **Sanctioned motifs.** For these two `currentColor` in-app marks only, **neuron, brain, and electricity (impulse/charge)** are sanctioned — a deliberate, scoped relaxation of the brain/neuron ban. It does not extend to the full-color S-Signal or the rest of the `glyphs/` set, which stay neuron-/brain-/spark-free.
- `banner-animated.svg` loops the spike draw-on (SMIL — plays in GitHub READMEs).
- `accept-flash.svg` + `accept-flash.md` — the proposed→accepted motion: 700ms, spike morphs into a bead that lands in the receptor while the cleft bridges. Spec only; not wired into UI.
- Rasterize `social-preview.svg` to PNG (≤1MB) before uploading to repo settings, e.g. `qlmanage -t -s 1280 -o /tmp kit/social-preview.svg`.

28
assets/brand/accept-flash.md Normal file
View file

@ -0,0 +1,28 @@
# Accept-flash — motion spec (Iris + Gold)
The transition from **proposed** (`icon.svg`: live spike, open receptor) to **accepted** (`icon-accepted.svg`: bridged cleft, gold seated in a closed receptor). Total **700 ms**, played once on accept, `fill: freeze`.
| Phase | Time (ms) | What moves | Easing |
|---|---|---|---|
| Charge | 0–120 | Spike pumps: stroke 11 → 13 → 11 (amplitude, not scale) | ease-out |
| Jump | 120–260 | Spike collapses tail-first (dash-offset 0 → length); a gold bead (r13) emerges at its head | cubic-bezier(.3, 0, .9, 1) |
| Travel | 260–480 | Bead rides the axon path into the terminal | cubic-bezier(.2, 0, .55, 1) |
| Bridge | 300–420 | Iris bridge draws across the cleft behind the bead (dash-offset 80 → 0) | ease-in-out |
| Land | 480–620 | Bead settles r18 → 15; receptor ring pops stroke 14 → 18 → 14 | ease-out, one overshoot, no bounce |
| Rest | 620–700 | Hold. End state ≡ `icon-accepted.svg` | — |
Bead path (256 grid): `M174 133 L177.4 141.9 A46 46 0 0 1 107 200.9 L85.7 177.8`
## Rules
- **One gold element at all times.** The spike morphs into the bead — they never coexist for more than one frame.
- **No glow, no blur, no shadow.** Energy is geometry: amplitude, overshoot, squash.
- Motion only on dash-offset, transform, and motion-path (compositor-friendly).
- Never longer than 700 ms — longer reads as ceremony, not confirmation.
- `prefers-reduced-motion`: replace with a 120 ms crossfade from open to accepted. No travel.
## Implementations
- **SMIL reference**: `accept-flash.svg` (looping demo: 600 ms open hold → flash → 1.1 s accepted hold → reset; production plays once and freezes).
- **Obsidian (CSS)**: bead as an element with `offset-path` set to the bead path; spike collapse via `stroke-dashoffset` transition; gate with `matchMedia('(prefers-reduced-motion: reduce)')`.
- End state must compose identically to `icon-accepted.svg` — the flash is a transition between the two shipped marks, never a third look.

29
assets/brand/accept-flash.svg Normal file
View file

@ -0,0 +1,29 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
<!-- Looping SMIL demo of accept-flash.md: 2400ms cycle = 600ms open hold,
700ms flash (spec phases offset +600ms), 1100ms accepted hold, reset.
Base attributes = the open/proposed state, so each cycle restart is the
reset and non-SMIL renderers show the proposed mark. -->
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="20" fill="#5A3EF0"></circle>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<path d="M108.3 108.2 Q131.0 132.0 177.4 141.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round" stroke-dasharray="80" stroke-dashoffset="80">
<animate attributeName="stroke-dashoffset" values="80;80;0;0" keyTimes="0;0.375;0.425;1" calcMode="spline" keySplines="0 0 1 1;0.42 0 0.58 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animate>
</path>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#5A3EF0" stroke-width="14">
<animate attributeName="stroke-width" values="14;14;18;14;14" keyTimes="0;0.45;0.479;0.5083;1" calcMode="spline" keySplines="0 0 1 1;0 0 0.2 1;0.4 0 1 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animate>
</circle>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#0A0718" stroke-width="19" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="178">
<animate attributeName="stroke-dashoffset" values="0;0;-178;-178" keyTimes="0;0.3;0.3583;1" calcMode="spline" keySplines="0 0 1 1;0.3 0 0.9 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animate>
</polyline>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#FFD23F" stroke-width="11" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="178">
<animate attributeName="stroke-width" values="11;11;13;11;11" keyTimes="0;0.25;0.275;0.3;1" calcMode="spline" keySplines="0 0 1 1;0 0 0.2 1;0.4 0 1 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animate>
<animate attributeName="stroke-dashoffset" values="0;0;-178;-178" keyTimes="0;0.3;0.3583;1" calcMode="spline" keySplines="0 0 1 1;0.3 0 0.9 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animate>
</polyline>
<g opacity="0">
<animate attributeName="opacity" values="0;1" keyTimes="0;0.3583" calcMode="discrete" dur="2400ms" repeatCount="indefinite"></animate>
<circle cx="0" cy="0" r="13" fill="#FFD23F" stroke="#0A0718" stroke-width="3.5">
<animate attributeName="r" values="13;13;18;15;15" keyTimes="0;0.45;0.4708;0.5083;1" calcMode="spline" keySplines="0 0 1 1;0 0 0.2 1;0.4 0 0.6 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animate>
</circle>
<animateMotion path="M174 133 L177.4 141.9 A46 46 0 0 1 107 200.9 L85.7 177.8" keyPoints="0;0;1;1" keyTimes="0;0.3583;0.45;1" calcMode="spline" keySplines="0 0 1 1;0.2 0 0.55 1;0 0 1 1" dur="2400ms" repeatCount="indefinite"></animateMotion>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

36
assets/brand/banner-animated.svg Normal file
View file

@ -0,0 +1,36 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 320">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#0A0718"></stop>
<stop offset="1" stop-color="#140F2A"></stop>
</linearGradient>
</defs>
<rect x="0" y="0" width="1280" height="320" rx="16" fill="url(#bg)"></rect>
<g transform="translate(0,0)" fill="none">
<circle cx="898" cy="104" r="5" fill="#5A3EF0" opacity="0.16"></circle>
<path d="M906 103 Q962 90 1006 90" stroke="#5A3EF0" stroke-width="2.5" stroke-linecap="round" opacity="0.16"></path>
<polyline points="1010,90 1022,76 1034,102 1046,90" stroke="#FFD23F" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.4"></polyline>
<path d="M1050 90 Q1096 92 1128 96" stroke="#5A3EF0" stroke-width="2.5" stroke-linecap="round" opacity="0.16"></path>
<circle cx="1148" cy="99" r="8.5" stroke="#5A3EF0" stroke-width="3" opacity="0.16"></circle>
<g opacity="0.10">
<circle cx="964" cy="232" r="4" fill="#5A3EF0"></circle>
<path d="M972 231 Q1040 222 1102 226" stroke="#5A3EF0" stroke-width="2" stroke-linecap="round"></path>
<path d="M1120 227 Q1136 229 1148 231" stroke="#5A3EF0" stroke-width="2" stroke-linecap="round"></path>
<circle cx="1166" cy="234" r="7" stroke="#5A3EF0" stroke-width="3"></circle>
</g>
</g>
<g transform="translate(72,56) scale(0.8125)">
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="20" fill="#5A3EF0"></circle>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#5A3EF0" stroke-width="14"></circle>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#0A0718" stroke-width="19" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="178" stroke-dashoffset="0">
<animate attributeName="stroke-dashoffset" values="178;0;0" keyTimes="0;0.3;1" calcMode="spline" keySplines="0.4 0 0.2 1;0 0 1 1" dur="4s" repeatCount="indefinite"></animate>
</polyline>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#FFD23F" stroke-width="11" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="178" stroke-dashoffset="0">
<animate attributeName="stroke-dashoffset" values="178;0;0" keyTimes="0;0.3;1" calcMode="spline" keySplines="0.4 0 0.2 1;0 0 1 1" dur="4s" repeatCount="indefinite"></animate>
</polyline>
</g>
<text x="336" y="168" font-family="&#39;Space Grotesk&#39;, &#39;Helvetica Neue&#39;, Arial, sans-serif" font-size="88" font-weight="500" letter-spacing="-1.76" fill="#F3F0FF">synapse</text>
<text x="340" y="220" font-family="&#39;Inter&#39;, -apple-system, BlinkMacSystemFont, &#39;Segoe UI&#39;, Roboto, sans-serif" font-size="26" font-weight="500" fill="#B7A8FF">More connections. Brighter thoughts.</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

56
assets/brand/banner.svg
View file

@ -1,38 +1,34 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 320">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#131019"/>
<stop offset="1" stop-color="#1D1630"/>
<stop offset="0" stop-color="#0A0718"></stop>
<stop offset="1" stop-color="#140F2A"></stop>
</linearGradient>
</defs>
<rect x="0" y="0" width="1280" height="320" rx="16" fill="url(#bg)"/>
<!-- faint synaptic-edge motif: filled sender dot, gapped edge, open receptor ring -->
<g stroke="#8b5cf6" fill="none" opacity="0.16">
<circle cx="898" cy="104" r="5" fill="#8b5cf6" stroke="none"/>
<path d="M906 103 Q990 84 1066 88" stroke-width="2.5" stroke-linecap="round"/>
<path d="M1088 90 Q1110 92 1128 96" stroke-width="2.5" stroke-linecap="round"/>
<circle cx="1148" cy="99" r="8.5" stroke-width="3"/>
<rect x="0" y="0" width="1280" height="320" rx="16" fill="url(#bg)"></rect>
<g transform="translate(0,0)" fill="none">
<circle cx="898" cy="104" r="5" fill="#5A3EF0" opacity="0.16"></circle>
<path d="M906 103 Q962 90 1006 90" stroke="#5A3EF0" stroke-width="2.5" stroke-linecap="round" opacity="0.16"></path>
<polyline points="1010,90 1022,76 1034,102 1046,90" stroke="#FFD23F" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.4"></polyline>
<path d="M1050 90 Q1096 92 1128 96" stroke="#5A3EF0" stroke-width="2.5" stroke-linecap="round" opacity="0.16"></path>
<circle cx="1148" cy="99" r="8.5" stroke="#5A3EF0" stroke-width="3" opacity="0.16"></circle>
<g opacity="0.10">
<circle cx="964" cy="232" r="4" fill="#5A3EF0"></circle>
<path d="M972 231 Q1040 222 1102 226" stroke="#5A3EF0" stroke-width="2" stroke-linecap="round"></path>
<path d="M1120 227 Q1136 229 1148 231" stroke="#5A3EF0" stroke-width="2" stroke-linecap="round"></path>
<circle cx="1166" cy="234" r="7" stroke="#5A3EF0" stroke-width="3"></circle>
</g>
</g>
<g stroke="#8b5cf6" fill="none" opacity="0.10">
<circle cx="964" cy="232" r="4" fill="#8b5cf6" stroke="none"/>
<path d="M972 231 Q1040 222 1102 226" stroke-width="2" stroke-linecap="round"/>
<path d="M1120 227 Q1136 229 1148 231" stroke-width="2" stroke-linecap="round"/>
<circle cx="1166" cy="234" r="7" stroke-width="3"/>
</g>
<!-- the mark -->
<g transform="translate(72,56) scale(0.8125)">
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.2" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="179.3" cy="64.4" r="20" fill="#8b5cf6"/>
<path d="M177.4 141.9 A46 46 0 0 1 107.0 200.9" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#8b5cf6" stroke-width="14"/>
<path d="M124.0 120.1 L143.1 113.9 A14 14 0 1 1 136.4 135.9 Z" fill="#CCFF00" stroke="#131019" stroke-width="5" stroke-linejoin="round"/>
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="20" fill="#5A3EF0"></circle>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#5A3EF0" stroke-width="14"></circle>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#0A0718" stroke-width="19" stroke-linecap="round" stroke-linejoin="round">
</polyline>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#FFD23F" stroke-width="11" stroke-linecap="round" stroke-linejoin="round">
</polyline>
</g>
<!-- wordmark: all-lowercase, Space Grotesk 500, -0.02em tracking, engineered n-a cleft -->
<text x="336" y="168" font-family="'Space Grotesk', 'Helvetica Neue', Arial, sans-serif" font-size="88" font-weight="500" letter-spacing="-1.76" fill="#F4F2FB">syn<tspan dx="6">apse</tspan></text>
<!-- tagline -->
<text x="340" y="220" font-family="'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif" font-size="26" font-weight="500" fill="#A78BFA">More connections. Brighter thoughts.</text>
</svg>
<text x="336" y="168" font-family="&#39;Space Grotesk&#39;, &#39;Helvetica Neue&#39;, Arial, sans-serif" font-size="88" font-weight="500" letter-spacing="-1.76" fill="#F3F0FF">synapse</text>
<text x="340" y="220" font-family="&#39;Inter&#39;, -apple-system, BlinkMacSystemFont, &#39;Segoe UI&#39;, Roboto, sans-serif" font-size="26" font-weight="500" fill="#B7A8FF">More connections. Brighter thoughts.</text>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

12
assets/brand/glyphs/synapse-actions.svg
View file

@ -1,7 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<g transform="translate(-1 -7.5) scale(1.08)">
<path d="M24 70 a16 14 0 0 1 -2 -26 a13 13 0 0 1 6 -16 a14 13 0 0 1 18 -2 a14 13 0 0 1 18 2 a13 13 0 0 1 6 16 a16 14 0 0 1 -2 26 a16 16 0 0 1 -22 4 a16 16 0 0 1 -22 -4 Z" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M50 25 V37 M50 63 V76" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M30 51 L43 51 L49 42 L56 59 L62 51 L70 51" fill="none" stroke="currentColor" stroke-width="8.5" stroke-linecap="round" stroke-linejoin="round"/>
</g>
</svg>
<path d="M70.5 26.2 A16.8 16.8 0 1 0 42.1 43.7" fill="none" stroke="currentColor" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="70.5" cy="26.2" r="8" fill="currentColor"></circle>
<path d="M69.8 57.2 A18.4 18.4 0 0 1 41.6 80.8" fill="none" stroke="currentColor" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="33.1" cy="71.5" r="9" fill="none" stroke="currentColor" stroke-width="6"></circle>
<polyline points="39.2,48.8 46.4,46.4 52.4,34.0 58.4,64.4 63.2,52.8 68.4,53.6" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 695 B

After

Width:  |  Height:  |  Size: 759 B

6
assets/brand/glyphs/synapse-checkpoints.svg
View file

@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M50 22 A28 28 0 1 1 26 36" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
<path d="M42 40 L60 50 L42 60 Z" fill="currentColor" stroke="currentColor" stroke-width="7" stroke-linejoin="round"/>
</svg>
<path d="M72.6 41.8 A24 24 0 1 1 38 29.2" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M42 39 L63 50 L42 61 Z" style="fill:var(--synapse-gold, #FFD23F)"></path>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 304 B

After

Width:  |  Height:  |  Size: 304 B

11
assets/brand/glyphs/synapse-deep-dive.svg
View file

@ -1,7 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="20" y="18" width="44" height="60" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M31 34 H53" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<path d="M31 45 H47" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<circle cx="59" cy="59" r="15" fill="none" stroke="currentColor" stroke-width="8"/>
<path d="M70 70 L83 83" stroke="currentColor" stroke-width="9" stroke-linecap="round"/>
</svg>
<circle cx="50" cy="50" r="27" fill="none" stroke="currentColor" stroke-width="7"></circle>
<path d="M6 50 H16" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="16,50 24,50 29,42 35,58 40,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="56" cy="50" r="8" fill="currentColor"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 549 B

After

Width:  |  Height:  |  Size: 536 B

13
assets/brand/glyphs/synapse-elaboration.svg
View file

@ -1,6 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="16" y="28" width="28" height="44" rx="7" fill="currentColor"/>
<path d="M58 38 H70" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
<path d="M58 50 H80" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
<path d="M58 62 H88" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
</svg>
<circle cx="24" cy="50" r="11" fill="currentColor"></circle>
<path d="M33 45 L57 31" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M33 55 L57 69" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="36,50 43,50 48,42 54,58 59,50 62,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="67" cy="27" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
<circle cx="72" cy="50" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
<circle cx="67" cy="73" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 405 B

After

Width:  |  Height:  |  Size: 870 B

17
assets/brand/glyphs/synapse-enrichment.svg
View file

@ -1,10 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="13" y="24" width="38" height="52" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M23 38 H41" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/>
<path d="M23 50 H41" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/>
<path d="M23 62 H35" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/>
<path d="M51 42 H64" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<circle cx="77" cy="42" r="9" fill="none" stroke="currentColor" stroke-width="7"/>
<path d="M51 62 H64" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<circle cx="77" cy="62" r="9" fill="none" stroke="currentColor" stroke-width="7"/>
</svg>
<circle cx="36" cy="52" r="12" fill="currentColor"></circle>
<path d="M44 44 L60 33" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="68" cy="28" r="7" style="fill:var(--synapse-gold, #FFD23F)"></circle>
<path d="M47 55 L69 56" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="78" cy="56" r="7" style="fill:var(--synapse-gold, #FFD23F)"></circle>
<path d="M42 62 L54 72" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="61" cy="78" r="7" style="fill:var(--synapse-gold, #FFD23F)"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 810 B

After

Width:  |  Height:  |  Size: 780 B

9
assets/brand/glyphs/synapse-fire.svg
View file

@ -1,4 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M14 78 a6 6 0 0 1 -6 -6 V34 a6 6 0 0 1 6 -6 H32 l7 8 H82 a6 6 0 0 1 6 6 V72 a6 6 0 0 1 -6 6 Z" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M20 54 H78 M66 42 L80 54 L66 66" fill="none" stroke="currentColor" stroke-width="9" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<circle cx="18" cy="50" r="9" fill="currentColor"></circle>
<polyline points="27,50 33,43 39,57 45,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="53" cy="50" r="9" fill="currentColor"></circle>
<path d="M62 50 H70" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="80" cy="50" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 397 B

After

Width:  |  Height:  |  Size: 594 B

9
assets/brand/glyphs/synapse-main.svg
View file

@ -1,6 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="29" y="20" width="42" height="60" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M40 39 H60" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<path d="M40 50 H60" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<path d="M40 61 H53" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
</svg>
<circle cx="32" cy="50" r="11" fill="currentColor"></circle>
<path d="M43 50 H60" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="70" cy="50" r="9" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 460 B

After

Width:  |  Height:  |  Size: 356 B

11
assets/brand/glyphs/synapse-organize.svg
View file

@ -1,4 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M41 56 V20 a5 5 0 0 1 5 -5 H64 a5 5 0 0 1 5 5 V56" fill="currentColor"/>
<path d="M14 84 a6 6 0 0 1 -6 -6 V40 a6 6 0 0 1 6 -6 H32 l7 8 H84 a6 6 0 0 1 6 6 V78 a6 6 0 0 1 -6 6 Z" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
</svg>
<circle cx="50" cy="20" r="9" fill="currentColor"></circle>
<path d="M44 26 L30 42" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M56 26 L70 42" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="27" cy="49" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
<circle cx="73" cy="49" r="8" fill="currentColor"></circle>
<polyline points="73,57 78,63 68,68 73,74" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="73" cy="82" r="7" fill="none" stroke="currentColor" stroke-width="6"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 337 B

After

Width:  |  Height:  |  Size: 822 B

10
assets/brand/glyphs/synapse-rem.svg
View file

@ -1,5 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="13" y="12" width="30" height="42" rx="7" fill="currentColor"/>
<rect x="57" y="46" width="30" height="42" rx="7" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M40 48 L60 60" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
</svg>
<circle cx="22" cy="30" r="10" fill="currentColor"></circle>
<path d="M30 36 L43 46" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="43,46 49,41 53,55 59,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<path d="M59 50 L68 58" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="77" cy="66" r="9" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 375 B

After

Width:  |  Height:  |  Size: 668 B

14
assets/brand/glyphs/synapse-summarize.svg
View file

@ -1,6 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M12 38 H42" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
<path d="M12 50 H34" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
<path d="M12 62 H24" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>
<rect x="56" y="28" width="28" height="44" rx="7" fill="currentColor"/>
</svg>
<circle cx="22" cy="28" r="8" fill="currentColor"></circle>
<circle cx="18" cy="50" r="8" fill="currentColor"></circle>
<circle cx="22" cy="72" r="8" fill="currentColor"></circle>
<path d="M29 32 L52 46" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M25 50 H50" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M29 68 L52 54" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="52,50 58,42 64,58 69,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="79" cy="50" r="8.5" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 405 B

After

Width:  |  Height:  |  Size: 922 B

11
assets/brand/glyphs/synapse-tidy.svg
View file

@ -1,7 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="29" y="20" width="42" height="60" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M52 32 H62" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<path d="M42 43 H56" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<path d="M38 58 H62" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
<path d="M38 68 H62" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>
</svg>
<path d="M6 52 Q13 40 20 52 Q26 62 32 52" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="34,52 40,44 46,60 50,52" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<path d="M52 52 H66" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<circle cx="77" cy="52" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 547 B

After

Width:  |  Height:  |  Size: 620 B

11
assets/brand/glyphs/synapse-transcribe.svg
View file

@ -1,6 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M13 44 V56" stroke="currentColor" stroke-width="7.5" stroke-linecap="round"/>
<path d="M24 32 V68" stroke="currentColor" stroke-width="7.5" stroke-linecap="round"/>
<path d="M35 40 V60" stroke="currentColor" stroke-width="7.5" stroke-linecap="round"/>
<rect x="50" y="22" width="37" height="56" rx="8" fill="currentColor"/>
</svg>
<path d="M14 44 V56" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M24 33 V67" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M34 42 V58" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="40,50 46,42 52,58 56,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="69" cy="50" r="8.5" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 411 B

After

Width:  |  Height:  |  Size: 730 B

8
assets/brand/glyphs/synapse-video.svg
View file

@ -1,4 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="12" y="22" width="76" height="56" rx="10" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>
<path d="M42 38 L62 50 L42 62 Z" fill="currentColor" stroke="currentColor" stroke-width="7" stroke-linejoin="round"/>
</svg>
<polygon points="16,36 38,50 16,64" fill="currentColor" stroke="currentColor" stroke-width="6" stroke-linejoin="round"></polygon>
<path d="M42 50 H46" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path>
<polyline points="46,50 52,42 58,58 62,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>
<circle cx="75" cy="50" r="8.5" fill="none" stroke="currentColor" stroke-width="6.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 320 B

After

Width:  |  Height:  |  Size: 604 B

14
assets/brand/icon-accepted.svg
View file

@ -1,8 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.2" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="179.3" cy="64.4" r="20" fill="#8b5cf6"/>
<path d="M108.3 108.2 Q131.0 132.0 177.4 141.9" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<path d="M177.4 141.9 A46 46 0 0 1 107.0 200.9" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#8b5cf6" stroke-width="14"/>
<circle cx="85.7" cy="177.8" r="15" fill="#CCFF00" stroke="#131019" stroke-width="3.5"/>
</svg>
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="20" fill="#5A3EF0"></circle>
<path d="M108.3 108.2 Q131.0 132.0 177.4 141.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#5A3EF0" stroke-width="14"></circle>
<circle cx="85.7" cy="177.8" r="15" fill="#FFD23F" stroke="#0A0718" stroke-width="3.5"></circle>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 670 B

After

Width:  |  Height:  |  Size: 709 B

6
assets/brand/icon-mono.svg
View file

@ -1,5 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M34 46 L25 39 M25 39 L19 31 M19 31 L20 22 M19 31 L11 27 M25 39 L14 45" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="43" cy="50" r="14" fill="currentColor"/>
<path d="M57 50 L65 50 L71 40 L78 60 L84 50 L91 50" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<path d="M34 46 L25 39 M25 39 L19 31 M19 31 L20 22 M19 31 L11 27 M25 39 L14 45" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"></path><circle cx="43" cy="50" r="14" fill="currentColor"></circle><path d="M57 50 L65 50 L71 40 L78 60 L84 50 L91 50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 461 B

After

Width:  |  Height:  |  Size: 496 B

11
assets/brand/icon-small.svg
View file

@ -1,6 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
<path d="M162.2 63.0 A42 42 0 1 0 91.9 107.7" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="162.2" cy="63.0" r="20" fill="#8b5cf6"/>
<path d="M170.1 158.3 A42 42 0 1 1 94.6 195.1" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<path d="M108.0 113.0 L128.9 111.1 A23 23 0 1 1 108.0 134.0 Z" fill="#CCFF00" stroke="#131019" stroke-width="3" stroke-linejoin="round"/>
</svg>
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="28" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="21" fill="#5A3EF0"></circle>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="28" stroke-linecap="round"></path>
<polyline points="96,120 124,86 146,164 176,128" fill="none" stroke="#0A0718" stroke-width="26" stroke-linecap="round" stroke-linejoin="round"></polyline>
<polyline points="96,120 124,86 146,164 176,128" fill="none" stroke="#FFD23F" stroke-width="17" stroke-linecap="round" stroke-linejoin="round"></polyline>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 506 B

After

Width:  |  Height:  |  Size: 699 B

15
assets/brand/icon.svg
View file

@ -1,7 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.2" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="179.3" cy="64.4" r="20" fill="#8b5cf6"/>
<path d="M177.4 141.9 A46 46 0 0 1 107.0 200.9" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#8b5cf6" stroke-width="14"/>
<path d="M124.0 120.1 L143.1 113.9 A14 14 0 1 1 136.4 135.9 Z" fill="#CCFF00" stroke="#131019" stroke-width="5" stroke-linejoin="round"/>
</svg>
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="20" fill="#5A3EF0"></circle>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#5A3EF0" stroke-width="14"></circle>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#0A0718" stroke-width="19" stroke-linecap="round" stroke-linejoin="round">
</polyline>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#FFD23F" stroke-width="11" stroke-linecap="round" stroke-linejoin="round">
</polyline>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 597 B

After

Width:  |  Height:  |  Size: 836 B

BIN
assets/brand/social-preview.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 679 KiB

After

Width:  |  Height:  |  Size: 663 KiB

55
assets/brand/social-preview.svg
View file

@ -1,39 +1,34 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 640">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#131019"/>
<stop offset="1" stop-color="#1D1630"/>
<stop offset="0" stop-color="#0A0718"></stop>
<stop offset="1" stop-color="#140F2A"></stop>
</linearGradient>
</defs>
<!-- full-bleed background, no corner radius: unfurl clients round their own corners -->
<rect x="0" y="0" width="1280" height="640" fill="url(#bg)"/>
<!-- faint synaptic-edge motifs: filled sender dot, gapped edge, open receptor ring; sacrificial — may crop away outside the 64px safe area -->
<g stroke="#8b5cf6" fill="none" opacity="0.16">
<circle cx="916" cy="158" r="6" fill="#8b5cf6" stroke="none"/>
<path d="M928 155 Q1040 124 1146 118" stroke-width="3" stroke-linecap="round"/>
<path d="M1172 117 Q1200 116 1224 114" stroke-width="3" stroke-linecap="round"/>
<circle cx="1250" cy="112" r="11" stroke-width="3"/>
<rect x="0" y="0" width="1280" height="640" fill="url(#bg)"></rect>
<g stroke="#5A3EF0" fill="none" opacity="0.16">
<circle cx="916" cy="158" r="6" fill="#5A3EF0" stroke="none"></circle>
<path d="M928 155 Q1024 130 1096 122" stroke-width="3" stroke-linecap="round"></path>
<path d="M1148 118 Q1188 116 1216 114" stroke-width="3" stroke-linecap="round"></path>
<circle cx="1242" cy="112" r="11" stroke-width="3"></circle>
</g>
<g stroke="#8b5cf6" fill="none" opacity="0.10">
<circle cx="32" cy="622" r="6" fill="#8b5cf6" stroke="none"/>
<path d="M44 619 Q112 606 174 599" stroke-width="2.5" stroke-linecap="round"/>
<path d="M198 597 Q214 596 228 595" stroke-width="2.5" stroke-linecap="round"/>
<circle cx="252" cy="593" r="10" stroke-width="3"/>
<polyline points="1100,122 1114,106 1128,132 1144,118" fill="none" stroke="#FFD23F" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" opacity="0.4"></polyline>
<g stroke="#5A3EF0" fill="none" opacity="0.10">
<circle cx="44" cy="610" r="6" fill="#5A3EF0" stroke="none"></circle>
<path d="M56 607 Q124 594 186 587" stroke-width="2.5" stroke-linecap="round"></path>
<path d="M210 585 Q226 584 240 583" stroke-width="2.5" stroke-linecap="round"></path>
<circle cx="264" cy="581" r="10" stroke-width="3"></circle>
</g>
<!-- the mark: canonical icon.svg elements, byte-for-byte; transform centers the ink (not the viewBox) on x~640 -->
<g transform="translate(487,44) scale(1.2)">
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.2" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="179.3" cy="64.4" r="20" fill="#8b5cf6"/>
<path d="M177.4 141.9 A46 46 0 0 1 107.0 200.9" fill="none" stroke="#8b5cf6" stroke-width="26" stroke-linecap="round"/>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#8b5cf6" stroke-width="14"/>
<path d="M124.0 120.1 L143.1 113.9 A14 14 0 1 1 136.4 135.9 Z" fill="#CCFF00" stroke="#131019" stroke-width="5" stroke-linejoin="round"/>
<path d="M179.3 64.4 A42 42 0 1 0 108.3 108.1" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="179.3" cy="64.4" r="20" fill="#5A3EF0"></circle>
<path d="M177.4 141.9 A46 46 0 0 1 107 200.9" fill="none" stroke="#5A3EF0" stroke-width="26" stroke-linecap="round"></path>
<circle cx="85.7" cy="177.8" r="22.5" fill="none" stroke="#5A3EF0" stroke-width="14"></circle>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#0A0718" stroke-width="19" stroke-linecap="round" stroke-linejoin="round">
</polyline>
<polyline points="101,121 119,115 134,84 149,160 161,131 174,133" fill="none" stroke="#FFD23F" stroke-width="11" stroke-linecap="round" stroke-linejoin="round">
</polyline>
</g>
<!-- wordmark + qualifier, one centered chunk on shared baseline y=458: Space Grotesk 500 with the engineered n-a cleft, then "for Obsidian" in Inter 500 -->
<text x="640" y="458" text-anchor="middle" font-family="'Space Grotesk', 'Helvetica Neue', Arial, sans-serif" font-size="116" font-weight="500" letter-spacing="-2.32" fill="#F4F2FB">syn<tspan dx="8">apse</tspan><tspan dx="28" font-family="'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif" font-size="40" letter-spacing="normal">for Obsidian</tspan></text>
<!-- tagline -->
<text x="640" y="544" text-anchor="middle" font-family="'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif" font-size="36" font-weight="500" fill="#A78BFA">More connections. Brighter thoughts.</text>
</svg>
<text x="640" y="458" text-anchor="middle" font-family="&#39;Space Grotesk&#39;, &#39;Helvetica Neue&#39;, Arial, sans-serif" font-size="116" font-weight="500" letter-spacing="-2.32" fill="#F3F0FF">synapse<tspan dx="28" font-family="&#39;Inter&#39;, -apple-system, BlinkMacSystemFont, &#39;Segoe UI&#39;, Roboto, sans-serif" font-size="40" letter-spacing="normal">for Obsidian</tspan></text>
<text x="640" y="544" text-anchor="middle" font-family="&#39;Inter&#39;, -apple-system, BlinkMacSystemFont, &#39;Segoe UI&#39;, Roboto, sans-serif" font-size="36" font-weight="500" fill="#B7A8FF">More connections. Brighter thoughts.</text>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.7 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

6
docs/plans/donation-sponsorship-plan.md
View file

@ -131,11 +131,11 @@ Placement: **near the bottom**, after Features / Install / Usage — never in th
Synapse is free and open source. If it has earned a place in your workflow,
you can support continued development:
[![Sponsor on GitHub](https://img.shields.io/badge/Sponsor-GitHub-8b5cf6?logo=github)](https://github.com/sponsors/dustinkeeton)
[![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-5b21b6?logo=buymeacoffee&logoColor=white)](https://www.buymeacoffee.com/<bmc-handle>)
[![Sponsor on GitHub](https://img.shields.io/badge/Sponsor-GitHub-5A3EF0?logo=github)](https://github.com/sponsors/dustinkeeton)
[![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-FFD23F?logo=buymeacoffee&logoColor=0A0718)](https://www.buymeacoffee.com/<bmc-handle>)
```
(Badge colors above use the brand violets — Synapse Violet `#8b5cf6` and Threshold Violet `#5b21b6` — so the section reads as part of the identity rather than stock badge clutter.)
(Badge colors above use the brand palette — Iris `#5A3EF0` and Gold `#FFD23F` — so the section reads as part of the identity rather than stock badge clutter.)
### d) Settings panel (optional, non-intrusive)

6
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "synapse",
"version": "1.0.7",
"version": "1.0.10",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "synapse",
"version": "1.0.7",
"version": "1.0.10",
"license": "AGPL-3.0-only",
"devDependencies": {
"@emnapi/core": "^1.7.1",
@ -5104,6 +5104,7 @@
"integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
"dev": true,
"license": "MIT",
"peer": true,
"engines": {
"node": ">=12"
},
@ -6395,7 +6396,6 @@
"integrity": "sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==",
"dev": true,
"license": "ISC",
"peer": true,
"bin": {
"yaml": "bin.mjs"
},

13
src/brand-icons.test.ts
View file

@ -44,13 +44,18 @@ describe('brand-icons', () => {
}
});
it('draws every glyph as a non-empty currentColor silhouette with no baked palette color', () => {
it('draws every glyph as a currentColor silhouette; gold only via the theme var', () => {
for (const [name, body] of Object.entries(SYNAPSE_ICONS)) {
expect(body, name).toBeTruthy();
// Color comes from the host UI (mono ribbon/palette, CSS tint in the
// sidebar) — the bodies must use currentColor and never a hardcoded hex.
// Body ink comes from the host UI via currentColor; the only other color
// allowed is the impulse gold, and only through the theme var (with its
// canonical fallback) so styles.css can retune it per light/dark surface.
expect(body, name).toContain('currentColor');
expect(body.includes('#'), `${name} must not bake a hex color`).toBe(false);
const withoutGold = body.split('var(--synapse-gold, #FFD23F)').join('');
expect(
withoutGold.includes('#'),
`${name} must not bake a color outside var(--synapse-gold, #FFD23F)`,
).toBe(false);
}
});

64
src/brand-icons.ts
View file

@ -2,8 +2,9 @@
* Bespoke Synapse icon glyphs, registered with Obsidian's `addIcon` (#349).
*
* Each value is SVG *inner content* on the `0 0 100 100` viewBox `addIcon`
* expects, drawn in `currentColor` — the host UI supplies the color (ribbon/
* palette render mono; the Synapse actions sidebar tints per feature via CSS).
* expects. Bodies are drawn in `currentColor` — the host UI supplies the ink —
* while the impulse (the one gold gesture per glyph, 2026 Iris+Gold refresh)
* is `var(--synapse-gold, #FFD23F)`, themed per surface in `styles.css`.
*
* The glyph NAMES are the contract in `src/commands/icons.ts` (`FEATURE_ICONS`
* + the per-action `icon` overrides in the registry); keep this map in lockstep
@ -17,46 +18,45 @@
import { addIcon } from 'obsidian';
/**
* Monochrome `currentColor` in-app proposals mark: a NEURON (dendrites, a filled
* soma, and an axon carrying one round-capped impulse), built around the brand's
* impulse/charge idea (#349 review). Mirrors `assets/brand/icon-mono.svg` and
* INTENTIONALLY diverges from the canonical full-color S-Signal (`icon.svg` etc.),
* which is unchanged. Do not recolor; the color comes from the host UI via
* `currentColor`.
* In-app proposals mark: a NEURON (dendrites, a filled soma, and an axon
* carrying the impulse), built around the brand's impulse/charge idea (#349
* review). Mirrors `assets/brand/icon-mono.svg` — body in `currentColor`, the
* axon spike in the gold var — and INTENTIONALLY diverges from the canonical
* full-color S-Signal (`icon.svg` etc.). Do not recolor the body; its ink
* comes from the host UI via `currentColor`.
*/
export const SYNAPSE_ICON_SVG =
'<path d="M34 46 L25 39 M25 39 L19 31 M19 31 L20 22 M19 31 L11 27 M25 39 L14 45" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/> ' +
'<circle cx="43" cy="50" r="14" fill="currentColor"/> ' +
'<path d="M57 50 L65 50 L71 40 L78 60 L84 50 L91 50" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>';
'<path d="M34 46 L25 39 M25 39 L19 31 M19 31 L20 22 M19 31 L11 27 M25 39 L14 45" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"></path><circle cx="43" cy="50" r="14" fill="currentColor"></circle><path d="M57 50 L65 50 L71 40 L78 60 L84 50 L91 50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"></path>';
/**
* name -> inner SVG content for every Synapse-registered glyph. Keys MUST match
* the names in `src/commands/icons.ts` and the ribbon/view references in
* `src/main.ts` / `src/views/synapse-actions-view.ts`. The per-feature and
* per-action glyphs share one line-icon system (round caps/joins, one stroke
* weight, a canonical note shape, filled = the action's subject). The two in-app
* identity marks `synapse` (neuron) and `synapse-actions` (brain) each carry a
* round-capped impulse and intentionally diverge from the canonical S-Signal;
* the remaining glyphs stay impulse-free.
* `src/main.ts` / `src/views/synapse-actions-view.ts`. One line-icon system
* (round caps/joins, one stroke weight) speaking the Topology grammar: filled
* soma = what exists, open ring = what is proposed, line = connection, and the
* single gold gesture = what Synapse adds (`var(--synapse-gold, #FFD23F)`).
* `synapse-main` is deliberately impulse-free as the neutral fallback.
*/
export const SYNAPSE_ICONS: Readonly<Record<string, string>> = {
// In-app proposals identity mark — neuron (proposals ribbon + proposal views).
synapse: SYNAPSE_ICON_SVG,
// Launcher (Synapse actions ribbon + sidebar view = brain) + per-action overrides.
'synapse-actions': '<g transform="translate(-1 -7.5) scale(1.08)"> <path d="M24 70 a16 14 0 0 1 -2 -26 a13 13 0 0 1 6 -16 a14 13 0 0 1 18 -2 a14 13 0 0 1 18 2 a13 13 0 0 1 6 16 a16 14 0 0 1 -2 26 a16 16 0 0 1 -22 4 a16 16 0 0 1 -22 -4 Z" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/> <path d="M50 25 V37 M50 63 V76" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"/> <path d="M30 51 L43 51 L49 42 L56 59 L62 51 L70 51" fill="none" stroke="currentColor" stroke-width="8.5" stroke-linecap="round" stroke-linejoin="round"/> </g>',
'synapse-transcribe': '<path d="M13 44 V56" stroke="currentColor" stroke-width="7.5" stroke-linecap="round"/> <path d="M24 32 V68" stroke="currentColor" stroke-width="7.5" stroke-linecap="round"/> <path d="M35 40 V60" stroke="currentColor" stroke-width="7.5" stroke-linecap="round"/> <rect x="50" y="22" width="37" height="56" rx="8" fill="currentColor"/>',
'synapse-fire': '<path d="M14 78 a6 6 0 0 1 -6 -6 V34 a6 6 0 0 1 6 -6 H32 l7 8 H82 a6 6 0 0 1 6 6 V72 a6 6 0 0 1 -6 6 Z" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M20 54 H78 M66 42 L80 54 L66 66" fill="none" stroke="currentColor" stroke-width="9" stroke-linecap="round" stroke-linejoin="round"/>',
'synapse-checkpoints': '<path d="M50 22 A28 28 0 1 1 26 36" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round"/> <path d="M42 40 L60 50 L42 60 Z" fill="currentColor" stroke="currentColor" stroke-width="7" stroke-linejoin="round"/>',
// Per-feature default glyphs.
'synapse-main': '<rect x="29" y="20" width="42" height="60" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M40 39 H60" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <path d="M40 50 H60" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <path d="M40 61 H53" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>',
'synapse-elaboration': '<rect x="16" y="28" width="28" height="44" rx="7" fill="currentColor"/> <path d="M58 38 H70" stroke="currentColor" stroke-width="8" stroke-linecap="round"/> <path d="M58 50 H80" stroke="currentColor" stroke-width="8" stroke-linecap="round"/> <path d="M58 62 H88" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>',
'synapse-enrichment': '<rect x="13" y="24" width="38" height="52" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M23 38 H41" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/> <path d="M23 50 H41" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/> <path d="M23 62 H35" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/> <path d="M51 42 H64" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <circle cx="77" cy="42" r="9" fill="none" stroke="currentColor" stroke-width="7"/> <path d="M51 62 H64" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <circle cx="77" cy="62" r="9" fill="none" stroke="currentColor" stroke-width="7"/>',
'synapse-organize': '<path d="M41 56 V20 a5 5 0 0 1 5 -5 H64 a5 5 0 0 1 5 5 V56" fill="currentColor"/> <path d="M14 84 a6 6 0 0 1 -6 -6 V40 a6 6 0 0 1 6 -6 H32 l7 8 H84 a6 6 0 0 1 6 6 V78 a6 6 0 0 1 -6 6 Z" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/>',
'synapse-deep-dive': '<rect x="20" y="18" width="44" height="60" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M31 34 H53" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <path d="M31 45 H47" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <circle cx="59" cy="59" r="15" fill="none" stroke="currentColor" stroke-width="8"/> <path d="M70 70 L83 83" stroke="currentColor" stroke-width="9" stroke-linecap="round"/>',
'synapse-summarize': '<path d="M12 38 H42" stroke="currentColor" stroke-width="8" stroke-linecap="round"/> <path d="M12 50 H34" stroke="currentColor" stroke-width="8" stroke-linecap="round"/> <path d="M12 62 H24" stroke="currentColor" stroke-width="8" stroke-linecap="round"/> <rect x="56" y="28" width="28" height="44" rx="7" fill="currentColor"/>',
'synapse-tidy': '<rect x="29" y="20" width="42" height="60" rx="8" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M52 32 H62" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <path d="M42 43 H56" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <path d="M38 58 H62" stroke="currentColor" stroke-width="7" stroke-linecap="round"/> <path d="M38 68 H62" stroke="currentColor" stroke-width="7" stroke-linecap="round"/>',
'synapse-rem': '<rect x="13" y="12" width="30" height="42" rx="7" fill="currentColor"/> <rect x="57" y="46" width="30" height="42" rx="7" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M40 48 L60 60" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round"/>',
'synapse-video': '<rect x="12" y="22" width="76" height="56" rx="10" fill="none" stroke="currentColor" stroke-width="8" stroke-linejoin="round"/> <path d="M42 38 L62 50 L42 62 Z" fill="currentColor" stroke="currentColor" stroke-width="7" stroke-linejoin="round"/>',
// Launcher (Synapse actions ribbon + sidebar view) — the S-Signal itself at
// glyph weight (the brain mark is retired; the neuron remains the proposals mark).
'synapse-actions': '<path d="M70.5 26.2 A16.8 16.8 0 1 0 42.1 43.7" fill="none" stroke="currentColor" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="70.5" cy="26.2" r="8" fill="currentColor"></circle> <path d="M69.8 57.2 A18.4 18.4 0 0 1 41.6 80.8" fill="none" stroke="currentColor" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="33.1" cy="71.5" r="9" fill="none" stroke="currentColor" stroke-width="6"></circle> <polyline points="39.2,48.8 46.4,46.4 52.4,34.0 58.4,64.4 63.2,52.8 68.4,53.6" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline>',
// Per-action override glyphs.
'synapse-transcribe': '<path d="M14 44 V56" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M24 33 V67" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M34 42 V58" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="40,50 46,42 52,58 56,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="69" cy="50" r="8.5" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-fire': '<circle cx="18" cy="50" r="9" fill="currentColor"></circle> <polyline points="27,50 33,43 39,57 45,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="53" cy="50" r="9" fill="currentColor"></circle> <path d="M62 50 H70" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="80" cy="50" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-checkpoints': '<path d="M72.6 41.8 A24 24 0 1 1 38 29.2" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M42 39 L63 50 L42 61 Z" style="fill:var(--synapse-gold, #FFD23F)"></path>',
// Per-feature default glyphs (synapse-main is deliberately impulse-free).
'synapse-main': '<circle cx="32" cy="50" r="11" fill="currentColor"></circle> <path d="M43 50 H60" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="70" cy="50" r="9" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-elaboration': '<circle cx="24" cy="50" r="11" fill="currentColor"></circle> <path d="M33 45 L57 31" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M33 55 L57 69" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="36,50 43,50 48,42 54,58 59,50 62,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="67" cy="27" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle> <circle cx="72" cy="50" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle> <circle cx="67" cy="73" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-enrichment': '<circle cx="36" cy="52" r="12" fill="currentColor"></circle> <path d="M44 44 L60 33" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="68" cy="28" r="7" style="fill:var(--synapse-gold, #FFD23F)"></circle> <path d="M47 55 L69 56" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="78" cy="56" r="7" style="fill:var(--synapse-gold, #FFD23F)"></circle> <path d="M42 62 L54 72" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="61" cy="78" r="7" style="fill:var(--synapse-gold, #FFD23F)"></circle>',
'synapse-organize': '<circle cx="50" cy="20" r="9" fill="currentColor"></circle> <path d="M44 26 L30 42" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M56 26 L70 42" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="27" cy="49" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle> <circle cx="73" cy="49" r="8" fill="currentColor"></circle> <polyline points="73,57 78,63 68,68 73,74" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="73" cy="82" r="7" fill="none" stroke="currentColor" stroke-width="6"></circle>',
'synapse-deep-dive': '<circle cx="50" cy="50" r="27" fill="none" stroke="currentColor" stroke-width="7"></circle> <path d="M6 50 H16" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="16,50 24,50 29,42 35,58 40,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="56" cy="50" r="8" fill="currentColor"></circle>',
'synapse-summarize': '<circle cx="22" cy="28" r="8" fill="currentColor"></circle> <circle cx="18" cy="50" r="8" fill="currentColor"></circle> <circle cx="22" cy="72" r="8" fill="currentColor"></circle> <path d="M29 32 L52 46" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M25 50 H50" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M29 68 L52 54" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="52,50 58,42 64,58 69,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="79" cy="50" r="8.5" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-tidy': '<path d="M6 52 Q13 40 20 52 Q26 62 32 52" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="34,52 40,44 46,60 50,52" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <path d="M52 52 H66" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="77" cy="52" r="8" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-rem': '<circle cx="22" cy="30" r="10" fill="currentColor"></circle> <path d="M30 36 L43 46" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="43,46 49,41 53,55 59,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <path d="M59 50 L68 58" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <circle cx="77" cy="66" r="9" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
'synapse-video': '<polygon points="16,36 38,50 16,64" fill="currentColor" stroke="currentColor" stroke-width="6" stroke-linejoin="round"></polygon> <path d="M42 50 H46" fill="none" stroke="currentColor" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></path> <polyline points="46,50 52,42 58,58 62,50" fill="none" style="stroke:var(--synapse-gold, #FFD23F)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round"></polyline> <circle cx="75" cy="50" r="8.5" fill="none" stroke="currentColor" stroke-width="6.5"></circle>',
};
/**

14
styles.css
View file

@ -47,6 +47,20 @@
--synapse-color-video-rgb: 220, 180, 70;
}
/*
* Brand impulse gold (2026 Iris+Gold refresh). Every registered glyph draws
* its body in currentColor and its single gold gesture in this var (see
* src/brand-icons.ts / assets/brand/README.md). Deepened on light surfaces
* for contrast against white.
*/
body {
--synapse-gold: #FFD23F;
}
.theme-light {
--synapse-gold: #E8B419;
}
/*
* Cap the height of embedded videos so portrait-oriented content
* (TikTok, Instagram Reels, phone recordings) does not dominate the note.