attune-system/attune
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

branding v1

Browse Source
This commit is contained in:
David Culbreth
2026-03-02 12:03:20 -06:00
parent bbe94d75f8
commit 42a9f1d31a
20 changed files with 1014 additions and 241 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
web/public/attune-favicon.svg Normal file
View File

@@ -0,0 +1,44 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="120 190 272 260" width="64" height="64">
<defs>
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
</defs>
<!-- Single U-shaped resonator -->
<path d="M 220 412 L 220 278 Q 220 248 250 228 Q 256 224 262 228 Q 292 248 292 278 L 292 412"
fill="none" stroke="url(#grad-primary)" stroke-width="32" stroke-linecap="round" stroke-linejoin="round" />
<!-- Crossbar -->
<path d="M 218 330 L 294 330"
fill="none" stroke="url(#grad-primary)" stroke-width="20" stroke-linecap="round" />
<!-- Event nodes on the crossbar -->
<circle cx="242" cy="330" r="11" fill="#14B8A6" opacity="0.9" />
<circle cx="270" cy="330" r="11" fill="#22D3EE" opacity="0.9" />
<!-- Outer branching event dots -->
<circle cx="318" cy="330" r="9" fill="url(#grad-accent)" opacity="0.7" />
<line x1="296" y1="330" x2="309" y2="330" stroke="url(#grad-accent)" stroke-width="5" stroke-linecap="round" opacity="0.6" />
<circle cx="194" cy="330" r="9" fill="url(#grad-accent)" opacity="0.7" />
<line x1="216" y1="330" x2="203" y2="330" stroke="url(#grad-accent)" stroke-width="5" stroke-linecap="round" opacity="0.6" />
<!-- Resonance arcs — left -->
<path d="M 168 274 Q 138 330 168 386"
fill="none" stroke="url(#grad-accent)" stroke-width="16" stroke-linecap="round" opacity="0.7" />
<path d="M 148 254 Q 110 330 148 406"
fill="none" stroke="url(#grad-accent)" stroke-width="12" stroke-linecap="round" opacity="0.5" />
<!-- Resonance arcs — right -->
<path d="M 344 274 Q 374 330 344 386"
fill="none" stroke="url(#grad-accent)" stroke-width="16" stroke-linecap="round" opacity="0.7" />
<path d="M 364 254 Q 402 330 364 406"
fill="none" stroke="url(#grad-accent)" stroke-width="12" stroke-linecap="round" opacity="0.5" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

152
web/public/attune-logo-full.svg Normal file
View File

@@ -0,0 +1,152 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 512" width="800" height="512">
<defs>
<!-- Primary gradient: deep indigo to vibrant blue -->
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Accent gradient: teal to cyan for flow lines -->
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
<!-- Glow gradient for the resonance ring -->
<linearGradient id="grad-glow" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#818CF8" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#14B8A6" />
</linearGradient>
<!-- Text gradient (left to right for horizontal text) -->
<linearGradient id="grad-text" x1="0%" y1="0%" x2="100%" y2="20%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Subtle shadow for depth -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#4F46E5" flood-opacity="0.2" />
</filter>
</defs>
<!-- Resonance arcs — left side (centered on crossbar y=330) -->
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -4 0; 0 0" dur="3s" repeatCount="indefinite" />
<path d="M 118 274 Q 88 330 118 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5">
<animate attributeName="opacity" values="0.3;0.6;0.3" dur="3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="4;8;4" dur="3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -5 0; 0 0" dur="3s" begin="0.3s" repeatCount="indefinite" />
<path d="M 98 254 Q 58 330 98 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35">
<animate attributeName="opacity" values="0.2;0.45;0.2" dur="3s" begin="0.3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="3;6;3" dur="3s" begin="0.3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -6 0; 0 0" dur="3s" begin="0.6s" repeatCount="indefinite" />
<path d="M 80 234 Q 30 330 80 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2">
<animate attributeName="opacity" values="0.1;0.3;0.1" dur="3s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="2;4;2" dur="3s" begin="0.6s" repeatCount="indefinite" />
</path>
</g>
<!-- Stylized 'A' — inverted tuning fork -->
<g filter="url(#shadow)">
<!-- Single U-shaped resonator: left foot → up left leg → curve through apex → down right leg → right foot -->
<path d="M 170 412 L 170 278 Q 170 248 200 228 Q 206 224 212 228 Q 242 248 242 278 L 242 412"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" stroke-linejoin="round" />
<!-- Handle / stem above the apex -->
<path d="M 206 70 L 206 224"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" />
<!-- Crossbar of the A -->
<path d="M 174 330 L 238 330"
fill="none" stroke="url(#grad-primary)" stroke-width="14" stroke-linecap="round" />
</g>
<!-- Stem dots (orchestration flow along the handle) -->
<circle cx="206" cy="120" r="5" fill="#22D3EE" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="0.2s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="0.2s" repeatCount="indefinite" />
</circle>
<circle cx="206" cy="150" r="6" fill="#14B8A6" opacity="0.7">
<animate attributeName="opacity" values="0.4;0.8;0.4" dur="2.5s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="r" values="4;7;4" dur="2.5s" begin="0.6s" repeatCount="indefinite" />
</circle>
<circle cx="206" cy="182" r="5" fill="#22D3EE" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="1.0s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="1.0s" repeatCount="indefinite" />
</circle>
<!-- Crossbar event node dots on the A -->
<circle cx="194" cy="330" r="7" fill="#14B8A6" opacity="0.8">
<animate attributeName="r" values="5;8;5" dur="2s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.6;1;0.6" dur="2s" repeatCount="indefinite" />
</circle>
<circle cx="218" cy="330" r="7" fill="#22D3EE" opacity="0.8">
<animate attributeName="r" values="5;8;5" dur="2s" begin="0.5s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.6;1;0.6" dur="2s" begin="0.5s" repeatCount="indefinite" />
</circle>
<!-- Left branching dot from the A crossbar -->
<circle cx="154" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="0.5s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="0.5s" repeatCount="indefinite" />
</circle>
<line x1="169" y1="330" x2="159" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Apex dot at the top of the A -->
<circle cx="206" cy="66" r="10" fill="url(#grad-primary)" opacity="0.9" />
<!-- "ttune" text — vertically centered on crossbar y=330 -->
<text x="260" y="372"
font-family="'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif"
font-size="130"
font-weight="600"
letter-spacing="-2"
fill="url(#grad-text)"
filter="url(#shadow)">ttune</text>
<!-- Right-side branching dot (connects text to resonance arcs) -->
<circle cx="583" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" repeatCount="indefinite" />
</circle>
<line x1="570" y1="330" x2="578" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Resonance arcs — right side (close to the 'e', centered on y=330) -->
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 4 0; 0 0" dur="3s" repeatCount="indefinite" />
<path d="M 609 274 Q 639 330 609 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5">
<animate attributeName="opacity" values="0.3;0.6;0.3" dur="3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="4;8;4" dur="3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 5 0; 0 0" dur="3s" begin="0.3s" repeatCount="indefinite" />
<path d="M 629 254 Q 669 330 629 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35">
<animate attributeName="opacity" values="0.2;0.45;0.2" dur="3s" begin="0.3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="3;6;3" dur="3s" begin="0.3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 6 0; 0 0" dur="3s" begin="0.6s" repeatCount="indefinite" />
<path d="M 647 234 Q 697 330 647 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2">
<animate attributeName="opacity" values="0.1;0.3;0.1" dur="3s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="2;4;2" dur="3s" begin="0.6s" repeatCount="indefinite" />
</path>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 8.3 KiB

71
web/public/attune-logo-icon.svg Normal file
View File

@@ -0,0 +1,71 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="60 55 392 385" width="392" height="385">
<defs>
<!-- Primary gradient: deep indigo to vibrant blue -->
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Accent gradient: teal to cyan for flow lines -->
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
<!-- Subtle shadow for depth -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#4F46E5" flood-opacity="0.2" />
</filter>
</defs>
<!-- Resonance arcs — left side (centered on crossbar y=330) -->
<path d="M 168 274 Q 138 330 168 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5" />
<path d="M 148 254 Q 108 330 148 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35" />
<path d="M 130 234 Q 80 330 130 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2" />
<!-- Resonance arcs — right side (centered on crossbar y=330) -->
<path d="M 344 274 Q 374 330 344 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5" />
<path d="M 364 254 Q 404 330 364 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35" />
<path d="M 382 234 Q 432 330 382 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2" />
<!-- Inverted tuning fork forming an 'A' shape -->
<g filter="url(#shadow)">
<!-- Single U-shaped resonator: left foot → up left leg → curve through apex → down right leg → right foot -->
<path d="M 220 412 L 220 278 Q 220 248 250 228 Q 256 224 262 228 Q 292 248 292 278 L 292 412"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" stroke-linejoin="round" />
<!-- Handle / stem above the apex -->
<path d="M 256 70 L 256 224"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" />
<!-- Crossbar of the A -->
<path d="M 224 330 L 288 330"
fill="none" stroke="url(#grad-primary)" stroke-width="14" stroke-linecap="round" />
</g>
<!-- Stem dots (orchestration flow along the handle) -->
<circle cx="256" cy="120" r="5" fill="#22D3EE" opacity="0.6" />
<circle cx="256" cy="150" r="6" fill="#14B8A6" opacity="0.7" />
<circle cx="256" cy="182" r="5" fill="#22D3EE" opacity="0.6" />
<!-- Node dots on the crossbar representing events/connections -->
<circle cx="244" cy="330" r="7" fill="#14B8A6" opacity="0.8" />
<circle cx="268" cy="330" r="7" fill="#22D3EE" opacity="0.8" />
<!-- Small orchestration flow dots branching from crossbar -->
<circle cx="308" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6" />
<line x1="293" y1="330" x2="303" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<circle cx="204" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6" />
<line x1="219" y1="330" x2="209" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Apex dot at the top of the A -->
<circle cx="256" cy="66" r="10" fill="url(#grad-primary)" opacity="0.9" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

124
web/public/attune-logo-navbar.svg Normal file
View File

@@ -0,0 +1,124 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="20 215 690 210" width="690" height="210">
<defs>
<!-- Primary gradient: deep indigo to vibrant blue -->
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Accent gradient: teal to cyan for flow lines -->
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
<!-- Text gradient (left to right for horizontal text) -->
<linearGradient id="grad-text" x1="0%" y1="0%" x2="100%" y2="20%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Subtle shadow for depth -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#4F46E5" flood-opacity="0.2" />
</filter>
</defs>
<!-- Resonance arcs — left side (centered on crossbar y=330) -->
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -4 0; 0 0" dur="3s" repeatCount="indefinite" />
<path d="M 118 274 Q 88 330 118 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5">
<animate attributeName="opacity" values="0.3;0.6;0.3" dur="3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="4;8;4" dur="3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -5 0; 0 0" dur="3s" begin="0.3s" repeatCount="indefinite" />
<path d="M 98 254 Q 58 330 98 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35">
<animate attributeName="opacity" values="0.2;0.45;0.2" dur="3s" begin="0.3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="3;6;3" dur="3s" begin="0.3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -6 0; 0 0" dur="3s" begin="0.6s" repeatCount="indefinite" />
<path d="M 80 234 Q 30 330 80 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2">
<animate attributeName="opacity" values="0.1;0.3;0.1" dur="3s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="2;4;2" dur="3s" begin="0.6s" repeatCount="indefinite" />
</path>
</g>
<!-- Stylized 'A' — inverted tuning fork (no handle/stem) -->
<g filter="url(#shadow)">
<!-- Single U-shaped resonator: left foot → up left leg → curve through apex → down right leg → right foot -->
<path d="M 170 412 L 170 278 Q 170 248 200 228 Q 206 224 212 228 Q 242 248 242 278 L 242 412"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" stroke-linejoin="round" />
<!-- Crossbar of the A -->
<path d="M 174 330 L 238 330"
fill="none" stroke="url(#grad-primary)" stroke-width="14" stroke-linecap="round" />
</g>
<!-- Crossbar event node dots on the A -->
<circle cx="194" cy="330" r="10" fill="#14B8A6" opacity="0.8">
<animate attributeName="r" values="8;11;8" dur="2s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.6;1;0.6" dur="2s" repeatCount="indefinite" />
</circle>
<circle cx="218" cy="330" r="10" fill="#22D3EE" opacity="0.8">
<animate attributeName="r" values="8;11;8" dur="2s" begin="0.5s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.6;1;0.6" dur="2s" begin="0.5s" repeatCount="indefinite" />
</circle>
<!-- Left branching dot from the A crossbar -->
<circle cx="154" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="0.5s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="0.5s" repeatCount="indefinite" />
</circle>
<line x1="169" y1="330" x2="159" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- "ttune" text — vertically centered on crossbar y=330 -->
<text x="260" y="372"
font-family="'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif"
font-size="130"
font-weight="600"
letter-spacing="-2"
fill="url(#grad-text)"
filter="url(#shadow)">ttune</text>
<!-- Right-side branching dot (connects text to resonance arcs) -->
<circle cx="583" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" repeatCount="indefinite" />
</circle>
<line x1="570" y1="330" x2="578" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Resonance arcs — right side (close to the 'e', centered on y=330) -->
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 4 0; 0 0" dur="3s" repeatCount="indefinite" />
<path d="M 609 274 Q 639 330 609 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5">
<animate attributeName="opacity" values="0.3;0.6;0.3" dur="3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="4;8;4" dur="3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 5 0; 0 0" dur="3s" begin="0.3s" repeatCount="indefinite" />
<path d="M 629 254 Q 669 330 629 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35">
<animate attributeName="opacity" values="0.2;0.45;0.2" dur="3s" begin="0.3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="3;6;3" dur="3s" begin="0.3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 6 0; 0 0" dur="3s" begin="0.6s" repeatCount="indefinite" />
<path d="M 647 234 Q 697 330 647 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2">
<animate attributeName="opacity" values="0.1;0.3;0.1" dur="3s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="2;4;2" dur="3s" begin="0.6s" repeatCount="indefinite" />
</path>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.9 KiB

83
web/public/attune-logo-static.svg Normal file
View File

@@ -0,0 +1,83 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
<defs>
<!-- Primary gradient: deep indigo to vibrant blue -->
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Accent gradient: teal to cyan for flow lines -->
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
<!-- Glow gradient for the resonance ring -->
<linearGradient id="grad-glow" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#818CF8" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#14B8A6" />
</linearGradient>
<!-- Subtle shadow for depth -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#4F46E5" flood-opacity="0.2" />
</filter>
</defs>
<!-- Background circle -->
<circle cx="256" cy="256" r="248" fill="none" stroke="url(#grad-glow)" stroke-width="3" opacity="0.3" />
<!-- Resonance arcs — left side (centered on crossbar y=330) -->
<path d="M 168 274 Q 138 330 168 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5" />
<path d="M 148 254 Q 108 330 148 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35" />
<path d="M 130 234 Q 80 330 130 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2" />
<!-- Resonance arcs — right side (centered on crossbar y=330) -->
<path d="M 344 274 Q 374 330 344 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5" />
<path d="M 364 254 Q 404 330 364 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35" />
<path d="M 382 234 Q 432 330 382 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2" />
<!-- Inverted tuning fork forming an 'A' shape -->
<g filter="url(#shadow)">
<!-- Single U-shaped resonator: left foot → up left leg → curve through apex → down right leg → right foot -->
<path d="M 220 412 L 220 278 Q 220 248 250 228 Q 256 224 262 228 Q 292 248 292 278 L 292 412"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" stroke-linejoin="round" />
<!-- Handle / stem above the apex -->
<path d="M 256 70 L 256 224"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" />
<!-- Crossbar of the A -->
<path d="M 224 330 L 288 330"
fill="none" stroke="url(#grad-primary)" stroke-width="14" stroke-linecap="round" />
</g>
<!-- Stem dots (orchestration flow along the handle) -->
<circle cx="256" cy="120" r="5" fill="#22D3EE" opacity="0.6" />
<circle cx="256" cy="150" r="6" fill="#14B8A6" opacity="0.7" />
<circle cx="256" cy="182" r="5" fill="#22D3EE" opacity="0.6" />
<!-- Node dots on the crossbar representing events/connections -->
<circle cx="244" cy="330" r="7" fill="#14B8A6" opacity="0.8" />
<circle cx="268" cy="330" r="7" fill="#22D3EE" opacity="0.8" />
<!-- Small orchestration flow dots branching from crossbar -->
<circle cx="308" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6" />
<line x1="293" y1="330" x2="303" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<circle cx="204" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6" />
<line x1="219" y1="330" x2="209" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Apex dot at the top of the A -->
<circle cx="256" cy="66" r="10" fill="url(#grad-primary)" opacity="0.9" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

65
web/public/attune-logo-watermark-tile.svg Normal file
View File

@@ -0,0 +1,65 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3000 2100" width="3000" height="2100">
<defs>
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
<linearGradient id="grad-glow" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#818CF8" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#14B8A6" />
</linearGradient>
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#4F46E5" flood-opacity="0.2" />
</filter>
</defs>
<!-- All content offset to center of tile: translate(1244, 794) -->
<g transform="translate(1244, 794)">
<!-- Background circle -->
<circle cx="256" cy="256" r="248" fill="none" stroke="url(#grad-glow)" stroke-width="3" opacity="0.3" />
<!-- Resonance arcs — left side -->
<path d="M 168 274 Q 138 330 168 386" fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5" />
<path d="M 148 254 Q 108 330 148 406" fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35" />
<path d="M 130 234 Q 80 330 130 426" fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2" />
<!-- Resonance arcs — right side -->
<path d="M 344 274 Q 374 330 344 386" fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5" />
<path d="M 364 254 Q 404 330 364 406" fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35" />
<path d="M 382 234 Q 432 330 382 426" fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2" />
<!-- Inverted tuning fork forming an 'A' shape -->
<g filter="url(#shadow)">
<path d="M 220 412 L 220 278 Q 220 248 250 228 Q 256 224 262 228 Q 292 248 292 278 L 292 412"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" stroke-linejoin="round" />
<path d="M 256 70 L 256 224"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" />
<path d="M 224 330 L 288 330"
fill="none" stroke="url(#grad-primary)" stroke-width="14" stroke-linecap="round" />
</g>
<!-- Stem dots -->
<circle cx="256" cy="120" r="5" fill="#22D3EE" opacity="0.6" />
<circle cx="256" cy="150" r="6" fill="#14B8A6" opacity="0.7" />
<circle cx="256" cy="182" r="5" fill="#22D3EE" opacity="0.6" />
<!-- Crossbar event nodes -->
<circle cx="244" cy="330" r="7" fill="#14B8A6" opacity="0.8" />
<circle cx="268" cy="330" r="7" fill="#22D3EE" opacity="0.8" />
<!-- Branching dots -->
<circle cx="308" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6" />
<line x1="293" y1="330" x2="303" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<circle cx="204" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6" />
<line x1="219" y1="330" x2="209" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Apex dot -->
<circle cx="256" cy="66" r="10" fill="url(#grad-primary)" opacity="0.9" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

139
web/public/attune-logo.svg Normal file
View File

@@ -0,0 +1,139 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
<defs>
<!-- Primary gradient: deep indigo to vibrant blue -->
<linearGradient id="grad-primary" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4F46E5" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#818CF8" />
</linearGradient>
<!-- Accent gradient: teal to cyan for flow lines -->
<linearGradient id="grad-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#14B8A6" />
<stop offset="100%" stop-color="#22D3EE" />
</linearGradient>
<!-- Glow gradient for the resonance ring -->
<linearGradient id="grad-glow" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#818CF8" />
<stop offset="50%" stop-color="#6366F1" />
<stop offset="100%" stop-color="#14B8A6" />
</linearGradient>
<!-- Subtle shadow for depth -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#4F46E5" flood-opacity="0.2" />
</filter>
</defs>
<!-- Background circle -->
<circle cx="256" cy="256" r="248" fill="none" stroke="url(#grad-glow)" stroke-width="3" opacity="0.3" />
<!-- Resonance arcs — left side (centered on crossbar y=330) -->
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -4 0; 0 0" dur="3s" repeatCount="indefinite" />
<path d="M 168 274 Q 138 330 168 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5">
<animate attributeName="opacity" values="0.3;0.6;0.3" dur="3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="4;8;4" dur="3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -5 0; 0 0" dur="3s" begin="0.3s" repeatCount="indefinite" />
<path d="M 148 254 Q 108 330 148 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35">
<animate attributeName="opacity" values="0.2;0.45;0.2" dur="3s" begin="0.3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="3;6;3" dur="3s" begin="0.3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; -6 0; 0 0" dur="3s" begin="0.6s" repeatCount="indefinite" />
<path d="M 130 234 Q 80 330 130 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2">
<animate attributeName="opacity" values="0.1;0.3;0.1" dur="3s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="2;4;2" dur="3s" begin="0.6s" repeatCount="indefinite" />
</path>
</g>
<!-- Resonance arcs — right side (centered on crossbar y=330) -->
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 4 0; 0 0" dur="3s" repeatCount="indefinite" />
<path d="M 344 274 Q 374 330 344 386"
fill="none" stroke="url(#grad-accent)" stroke-width="6" stroke-linecap="round" opacity="0.5">
<animate attributeName="opacity" values="0.3;0.6;0.3" dur="3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="4;8;4" dur="3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 5 0; 0 0" dur="3s" begin="0.3s" repeatCount="indefinite" />
<path d="M 364 254 Q 404 330 364 406"
fill="none" stroke="url(#grad-accent)" stroke-width="4.5" stroke-linecap="round" opacity="0.35">
<animate attributeName="opacity" values="0.2;0.45;0.2" dur="3s" begin="0.3s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="3;6;3" dur="3s" begin="0.3s" repeatCount="indefinite" />
</path>
</g>
<g transform="translate(0,0)">
<animateTransform attributeName="transform" type="translate" values="0 0; 6 0; 0 0" dur="3s" begin="0.6s" repeatCount="indefinite" />
<path d="M 382 234 Q 432 330 382 426"
fill="none" stroke="url(#grad-accent)" stroke-width="3" stroke-linecap="round" opacity="0.2">
<animate attributeName="opacity" values="0.1;0.3;0.1" dur="3s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="stroke-width" values="2;4;2" dur="3s" begin="0.6s" repeatCount="indefinite" />
</path>
</g>
<!-- Inverted tuning fork forming an 'A' shape -->
<g filter="url(#shadow)">
<!-- Single U-shaped resonator: left foot → up left leg → curve through apex → down right leg → right foot -->
<path d="M 220 412 L 220 278 Q 220 248 250 228 Q 256 224 262 228 Q 292 248 292 278 L 292 412"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" stroke-linejoin="round" />
<!-- Handle / stem above the apex -->
<path d="M 256 70 L 256 224"
fill="none" stroke="url(#grad-primary)" stroke-width="22" stroke-linecap="round" />
<!-- Crossbar of the A -->
<path d="M 224 330 L 288 330"
fill="none" stroke="url(#grad-primary)" stroke-width="14" stroke-linecap="round" />
</g>
<!-- Stem dots (orchestration flow along the handle) -->
<circle cx="256" cy="120" r="5" fill="#22D3EE" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="0.2s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="0.2s" repeatCount="indefinite" />
</circle>
<circle cx="256" cy="150" r="6" fill="#14B8A6" opacity="0.7">
<animate attributeName="opacity" values="0.4;0.8;0.4" dur="2.5s" begin="0.6s" repeatCount="indefinite" />
<animate attributeName="r" values="4;7;4" dur="2.5s" begin="0.6s" repeatCount="indefinite" />
</circle>
<circle cx="256" cy="182" r="5" fill="#22D3EE" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="1.0s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="1.0s" repeatCount="indefinite" />
</circle>
<!-- Node dots on the crossbar representing events/connections -->
<circle cx="244" cy="330" r="7" fill="#14B8A6" opacity="0.8">
<animate attributeName="r" values="5;8;5" dur="2s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.6;1;0.6" dur="2s" repeatCount="indefinite" />
</circle>
<circle cx="268" cy="330" r="7" fill="#22D3EE" opacity="0.8">
<animate attributeName="r" values="5;8;5" dur="2s" begin="0.5s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.6;1;0.6" dur="2s" begin="0.5s" repeatCount="indefinite" />
</circle>
<!-- Small orchestration flow dots branching from crossbar -->
<circle cx="308" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" repeatCount="indefinite" />
</circle>
<line x1="293" y1="330" x2="303" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<circle cx="204" cy="330" r="5" fill="url(#grad-accent)" opacity="0.6">
<animate attributeName="opacity" values="0.3;0.7;0.3" dur="2.5s" begin="0.5s" repeatCount="indefinite" />
<animate attributeName="r" values="3;6;3" dur="2.5s" begin="0.5s" repeatCount="indefinite" />
</circle>
<line x1="219" y1="330" x2="209" y2="330" stroke="url(#grad-accent)" stroke-width="2" stroke-linecap="round" opacity="0.5" />
<!-- Apex dot at the top of the A -->
<circle cx="256" cy="66" r="10" fill="url(#grad-primary)" opacity="0.9" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.8 KiB