<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 380 120" width="380" height="120" role="img" aria-label="Baton">
  <title>Baton</title>
  <desc>The Baton wordmark: a tapered baton fanning out to three nodes, beside the word "baton".</desc>
  <style>
    .wm { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; font-weight: 500; font-size: 60px; letter-spacing: 1px; fill: #20203a; }
    @media (prefers-color-scheme: dark) { .wm { fill: #f5f5f7; } }
  </style>
  <g transform="translate(4,2)">
    <polygon points="37.8,89.3 75.2,41.05 72.8,38.95 30.2,82.7" fill="#6b5cff"/>
    <circle cx="34" cy="86" r="6.5" fill="#6b5cff"/>
    <line x1="75" y1="40" x2="94" y2="27" stroke="#6b5cff" stroke-width="2.4"/>
    <line x1="76" y1="41" x2="98" y2="44" stroke="#6b5cff" stroke-width="2.4"/>
    <line x1="75" y1="42" x2="92" y2="58" stroke="#6b5cff" stroke-width="2.4"/>
    <circle cx="96" cy="26" r="6" fill="#2dd4bf"/>
    <circle cx="100" cy="44" r="6" fill="#2dd4bf"/>
    <circle cx="94" cy="60" r="6" fill="#2dd4bf"/>
  </g>
  <text class="wm" x="138" y="80">baton</text>
</svg>