> ## Documentation Index
> Fetch the complete documentation index at: https://docs.webrayn.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# webrain: MCP browser automation & web scraping server

> webrain is an open-source Rust MCP server for LLM-driven browser automation and web scraping. One binary, three browser engines, 17 intent-based tools, any MCP client.

<div className="landing">
  <div className="mesh">
    <span className="mesh-grid" />

    <span className="mesh-glow" />
  </div>

  <div className="galaxy" aria-hidden="true" />

  <div className="wrap">
    <div className="hero">
      <div>
        <span className="eyebrow"><span className="dot" />Rust · open source</span>
        <h1>Browser automation <em className="grad">for AI agents.</em></h1>
        <p className="lede">One Rust binary that gives any LLM a real browser. Scrape, clear bot gates, and transcribe videos, all on your machine.</p>

        <div className="cta-row">
          <a className="btn btn-primary" href="/quickstart">Get started<span className="ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span></a>
        </div>

        <div className="install-block">
          <div className="install-tabs" role="tablist" aria-label="Install by OS">
            <button className="install-os active" data-os="macos" role="tab" aria-selected="true" onClick={(e)=>{const blk=e.currentTarget.closest('.install-block');const code=blk.querySelector('.term-cmd');const os=e.currentTarget.getAttribute('data-os');const cmd=code.getAttribute('data-cmd-'+os);code.setAttribute('data-cmd',cmd);blk.querySelectorAll('.install-os').forEach(t=>{const on=t===e.currentTarget;t.classList.toggle('active',on);t.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.typeCmd(code,cmd);}}>macOS</button>
            <button className="install-os" data-os="linux" role="tab" aria-selected="false" onClick={(e)=>{const blk=e.currentTarget.closest('.install-block');const code=blk.querySelector('.term-cmd');const os=e.currentTarget.getAttribute('data-os');const cmd=code.getAttribute('data-cmd-'+os);code.setAttribute('data-cmd',cmd);blk.querySelectorAll('.install-os').forEach(t=>{const on=t===e.currentTarget;t.classList.toggle('active',on);t.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.typeCmd(code,cmd);}}>Linux</button>
            <button className="install-os" data-os="windows" role="tab" aria-selected="false" onClick={(e)=>{const blk=e.currentTarget.closest('.install-block');const code=blk.querySelector('.term-cmd');const os=e.currentTarget.getAttribute('data-os');const cmd=code.getAttribute('data-cmd-'+os);code.setAttribute('data-cmd',cmd);blk.querySelectorAll('.install-os').forEach(t=>{const on=t===e.currentTarget;t.classList.toggle('active',on);t.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.typeCmd(code,cmd);}}>Windows</button>
          </div>

          <div className="term">
            <div className="term-bar">
              <span className="term-dots">
                <i />

                <i />

                <i />
              </span>

              <span className="term-title">install webrain</span>

              <button className="copy-btn" aria-label="Copy install command" onClick={(e)=>{const btn=e.currentTarget;const blk=btn.closest('.install-block');const t=blk.querySelector('.term-cmd').getAttribute('data-cmd');if(navigator.clipboard&&t){navigator.clipboard.writeText(t).then(()=>{btn.classList.add('copied');setTimeout(()=>btn.classList.remove('copied'),1600);});}}}>
                <svg className="copy-ico" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
                  <rect x="9" y="9" width="13" height="13" rx="2" ry="2" />

                  <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
                </svg>

                <svg className="copy-check" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.6" strokeLinecap="round" strokeLinejoin="round">
                  <path d="m4 12 5 5L20 6" />
                </svg>
              </button>
            </div>

            <div className="term-body">
              <div className="term-line"><span className="term-prompt">❯</span><code className="term-cmd" data-cmd="curl -fsSL https://raw.githubusercontent.com/prokopis3/webrain/main/scripts/install.sh | bash" data-cmd-macos="curl -fsSL https://raw.githubusercontent.com/prokopis3/webrain/main/scripts/install.sh | bash" data-cmd-linux="curl -fsSL https://raw.githubusercontent.com/prokopis3/webrain/main/scripts/install.sh | bash" data-cmd-windows="irm https://raw.githubusercontent.com/prokopis3/webrain/main/scripts/install.ps1 | iex">curl -fsSL [https://raw.githubusercontent.com/prokopis3/webrain/main/scripts/install.sh](https://raw.githubusercontent.com/prokopis3/webrain/main/scripts/install.sh) | bash</code></div>
              <div className="term-line term-out"><span className="term-ok">✓</span><span>webrain installed · one binary, three engines</span></div>
            </div>
          </div>

          <p className="install-sub">No Node, no Python, no Docker. Runs on macOS, Linux, and Windows.</p>
        </div>
      </div>

      <div className="hero-visual">
        <div className="hero-web" aria-hidden="true">
          <svg viewBox="0 0 600 460" fill="none">
            <path className="hw-ring" d="M300 40 a260 190 0 1 1 0 380 a260 190 0 1 1 0 -380" />

            <path className="hw-ring" d="M300 90 a210 140 0 1 1 0 280 a210 140 0 1 1 0 -280" />

            <path className="hw-ring" d="M300 135 a160 95 0 1 1 0 190 a160 95 0 1 1 0 -190" />

            <path className="hw-spoke" d="M300 230 L560 230" />

            <path className="hw-spoke" d="M300 230 L483.8 95.6" />

            <path className="hw-spoke" d="M300 230 L300 40" />

            <path className="hw-spoke" d="M300 230 L116.2 95.6" />

            <path className="hw-spoke" d="M300 230 L40 230" />

            <path className="hw-spoke" d="M300 230 L116.2 364.4" />

            <path className="hw-spoke" d="M300 230 L300 420" />

            <path className="hw-spoke" d="M300 230 L483.8 364.4" />

            <rect className="hw-node hw-node-hub" x="296" y="226" width="8" height="8" rx="4" />

            <rect className="hw-node" x="557" y="224" width="6" height="6" rx="3" />

            <rect className="hw-node" x="480" y="90" width="6" height="6" rx="3" />

            <rect className="hw-node" x="297" y="34" width="6" height="6" rx="3" />

            <rect className="hw-node" x="110" y="90" width="6" height="6" rx="3" />

            <rect className="hw-node" x="34" y="224" width="6" height="6" rx="3" />

            <rect className="hw-node" x="110" y="358" width="6" height="6" rx="3" />

            <rect className="hw-node" x="297" y="414" width="6" height="6" rx="3" />

            <rect className="hw-node" x="480" y="358" width="6" height="6" rx="3" />

            <path className="hw-track" d="M300 90 a210 140 0 1 1 0 280 a210 140 0 1 1 0 -280" />

            <path className="hw-track hw-track-2" d="M300 40 a260 190 0 1 1 0 380 a260 190 0 1 1 0 -380" />

            <path className="hw-packet" d="M0 -4 a4 4 0 1 1 0 8 a4 4 0 1 1 0 -8" />

            <path className="hw-packet hw-packet-2" d="M0 -2.6 a2.6 2.6 0 1 1 0 5.2 a2.6 2.6 0 1 1 0 -5.2" />
          </svg>
        </div>

        <div className="wf-stage">
          <div className="wf-card3d" style={{ '--card': 0 }} data-tools="navigate observe extract">
            <div className="term workflow-term">
              <div className="term-bar">
                <span className="term-dots">
                  <i />

                  <i />

                  <i />
                </span>

                <span className="term-title">webrain · scrape</span>
                <span className="term-live"><i />live</span>
              </div>

              <div className="term-body wf-body">
                <div className="wf-group" style={{ '--i': 0 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>webrain mcp</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>MCP server ready · 17 tools</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 1 }}>
                  <div className="term-line wf-line wf-ask"><span className="term-prompt">❯</span><span>“scrape product prices from shop.example.com”</span></div>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>navigate shop.example.com</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>loaded · 0 challenges</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 2 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>observe product cards</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>24 product cards detected</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 3 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>extract json</code></div>
                  <div className="term-line wf-line wf-json"><span className="term-ok">✓</span><span>{'{ "title": "Widget", "price": 12.99 }'}</span></div>
                  <div className="term-line wf-line wf-json"><span className="term-ok">✓</span><span>{'{ "title": "Gadget", "price": 24.50 }'}</span></div>
                  <div className="term-line wf-line wf-done"><span className="term-ok">✓</span><span>done · 24 items → JSON</span><span className="wf-cursor" /></div>
                </div>
              </div>
            </div>
          </div>

          <div className="wf-card3d" style={{ '--card': 3 }} data-tools="vault session navigate batch">
            <div className="term workflow-term">
              <div className="term-bar">
                <span className="term-dots">
                  <i />

                  <i />

                  <i />
                </span>

                <span className="term-title">webrain · auth + batch</span>
                <span className="term-live"><i />live</span>
              </div>

              <div className="term-body wf-body">
                <div className="wf-group" style={{ '--i': 0 }}>
                  <div className="term-line wf-line wf-ask"><span className="term-prompt">❯</span><span>“extract prices from 12 auth pages behind Turnstile”</span></div>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>vault add store.example.com</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>credential stored · AES-256-GCM + TOTP</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 1 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>launch chrome</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>real chrome up · stealth, cdp 9222</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 2 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>navigate auth.store.example.com</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>challenge turnstile → cleared · native login</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 3 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>session login service=store profile=default</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>logged in · session saved, TOTP ok</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 4 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>batch extract · 12 urls (session)</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>12 pages · 214 items</span></div>
                  <div className="term-line wf-line wf-done"><span className="term-ok">✓</span><span>done · 214 products → JSON</span><span className="wf-cursor" /></div>
                </div>
              </div>
            </div>
          </div>

          <div className="wf-card3d" style={{ '--card': 2 }} data-tools="batch interact">
            <div className="term workflow-term">
              <div className="term-bar">
                <span className="term-dots">
                  <i />

                  <i />

                  <i />
                </span>

                <span className="term-title">webrain · batch interact</span>
                <span className="term-live"><i />live</span>
              </div>

              <div className="term-body wf-body">
                <div className="wf-group" style={{ '--i': 0 }}>
                  <div className="term-line wf-line wf-ask"><span className="term-prompt">❯</span><span>“collect specs from 40 public pages, no auth”</span></div>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>batch interact · 40 urls in parallel</code></div>
                </div>

                <div className="wf-group" style={{ '--i': 1 }}>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>clicked specs tab · read rows per page</span></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>312 rows · 0 logins</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 2 }}>
                  <div className="term-line wf-line wf-done"><span className="term-ok">✓</span><span>done · 312 specs → JSON</span><span className="wf-cursor" /></div>
                </div>
              </div>
            </div>
          </div>

          <div className="wf-card3d wf-dup" style={{ '--card': 1 }} data-tools="navigate observe extract">
            <div className="term workflow-term">
              <div className="term-bar">
                <span className="term-dots">
                  <i />

                  <i />

                  <i />
                </span>

                <span className="term-title">webrain · scrape</span>
                <span className="term-live"><i />live</span>
              </div>

              <div className="term-body wf-body">
                <div className="wf-group" style={{ '--i': 0 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>webrain mcp</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>MCP server ready · 17 tools</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 1 }}>
                  <div className="term-line wf-line wf-ask"><span className="term-prompt">❯</span><span>“scrape product prices from shop.example.com”</span></div>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>navigate shop.example.com</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>loaded · 0 challenges</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 2 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>observe product cards</code></div>
                  <div className="term-line wf-line"><span className="term-ok">✓</span><span>24 product cards detected</span></div>
                </div>

                <div className="wf-group" style={{ '--i': 3 }}>
                  <div className="term-line wf-line"><span className="term-prompt">❯</span><code>extract json</code></div>
                  <div className="term-line wf-line wf-json"><span className="term-ok">✓</span><span>{'{ "title": "Widget", "price": 12.99 }'}</span></div>
                  <div className="term-line wf-line wf-json"><span className="term-ok">✓</span><span>{'{ "title": "Gadget", "price": 24.50 }'}</span></div>
                  <div className="term-line wf-line wf-done"><span className="term-ok">✓</span><span>done · 24 items → JSON</span><span className="wf-cursor" /></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="session-term" id="session-term">
      <div className="term">
        <div className="term-bar">
          <span className="term-dots">
            <i />

            <i />

            <i />
          </span>

          <span className="term-title">webrain · live CLI session</span>
          <span className="term-live"><i />live</span>
        </div>

        <div className="session-body term-body">
          <div className="term-line" data-kind="cmd"><span className="term-prompt">❯</span><code data-cmd="webrain mcp">webrain mcp</code></div>
          <div className="term-line" data-kind="out"><span className="term-prompt" style={{ color: 'var(--faint)' }}>→</span><span className="term-out">✓ MCP server ready · <b>17 tools</b></span></div>
          <div className="term-line" data-kind="cmd"><span className="term-prompt">❯</span><code data-cmd="webrain_navigate shop.example.com">webrain\_navigate shop.example.com</code></div>
          <div className="term-line" data-kind="out"><span className="term-prompt" style={{ color: 'var(--faint)' }}>→</span><span className="term-out"><b>0 challenges</b> · 24 product cards detected</span></div>
          <div className="term-line" data-kind="cmd"><span className="term-prompt">❯</span><code data-cmd="webrain_extract mode=autoschema">webrain\_extract mode=autoschema</code></div>
          <div className="term-line" data-kind="out"><span className="term-prompt" style={{ color: 'var(--faint)' }}>→</span><span className="term-out">schema: {'{title, price, url}'} · <b>42 rows</b></span></div>
          <div className="term-line" data-kind="cmd"><span className="term-prompt">❯</span><code data-cmd="webrain_batch --op fetch · 12 urls">{'webrain_batch --op fetch · 12 urls'}</code></div>
          <div className="term-line" data-kind="out"><span className="term-prompt" style={{ color: 'var(--faint)' }}>→</span><span className="term-out">12 pages · 2.1s · <b>189 items</b></span></div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="logos">
      <div className="cap">Works with any MCP client</div>

      <div className="marquee">
        <div className="marquee-track">
          <div className="marquee-row">
            <span className="logo">
              <img src="https://cdn.simpleicons.org/anthropic/ffffff" alt="Claude" />
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/anthropic/ffffff" alt="Claude Code" />
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/cursor/ffffff" alt="Cursor" />
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/github/ffffff" alt="GitHub Copilot" />
            </span>

            <span className="logo" style={{ color: '#f5f5f4' }}>
              <svg fill="currentColor" height="22" viewBox="0 0 91 24" xmlns="http://www.w3.org/2000/svg" aria-label="Codex">
                <path d="M79.915 14.964l-5.53-7.548h3.33l3.88 5.256 3.88-5.256h3.24l-5.5 7.486 5.683 7.792h-3.361l-4.003-5.5-4.064 5.5H74.2l5.715-7.73zM66.368 23c-1.345 0-2.567-.326-3.667-.978-1.08-.652-1.935-1.579-2.567-2.78-.631-1.203-.947-2.608-.947-4.217 0-1.59.316-2.974.947-4.156.652-1.202 1.518-2.129 2.597-2.78 1.08-.652 2.272-.978 3.575-.978 1.813 0 3.33.55 4.553 1.65 1.222 1.1 1.956 2.597 2.2 4.491.082.693.112 1.477.092 2.353H62.09c.06 1.548.489 2.76 1.283 3.636.815.876 1.793 1.314 2.933 1.314h.184c.855 0 1.599-.224 2.23-.672.632-.448 1.06-1.06 1.284-1.833h2.933a6.147 6.147 0 01-2.322 3.575C69.433 22.54 68.018 23 66.368 23zm3.819-9.687c-.082-1.16-.469-2.077-1.161-2.75-.693-.692-1.558-1.038-2.597-1.038h-.214c-.978 0-1.844.315-2.597.947-.734.611-1.212 1.558-1.437 2.841h8.006zM47.834 23c-1.324 0-2.516-.326-3.575-.978-1.039-.652-1.854-1.579-2.444-2.78-.591-1.202-.887-2.598-.887-4.187 0-1.588.306-2.984.917-4.186.611-1.201 1.446-2.128 2.506-2.78 1.08-.652 2.281-.978 3.605-.978 1.08 0 2.047.224 2.903.672.855.449 1.497 1.019 1.925 1.711V1.306h2.903v21.388h-2.903v-2.108c-.408.672-1.06 1.242-1.956 1.711-.896.469-1.894.703-2.994.703zm.58-2.475c.856 0 1.62-.234 2.292-.703.672-.468 1.192-1.11 1.558-1.925.387-.835.58-1.782.58-2.841 0-1.06-.193-1.997-.58-2.812-.366-.835-.886-1.487-1.558-1.955a3.911 3.911 0 00-2.292-.703h-.183c-1.304 0-2.363.51-3.178 1.528-.794 1.018-1.191 2.332-1.191 3.941 0 1.61.397 2.924 1.191 3.942.815 1.019 1.874 1.528 3.178 1.528h.183zM31.022 23c-1.406 0-2.679-.337-3.82-1.009a7.367 7.367 0 01-2.688-2.841c-.652-1.223-.978-2.587-.978-4.095 0-1.507.326-2.862.978-4.064.651-1.222 1.548-2.17 2.688-2.841 1.141-.693 2.414-1.04 3.82-1.04 1.405 0 2.668.347 3.789 1.04 1.14.672 2.037 1.62 2.688 2.841.652 1.202.978 2.557.978 4.064 0 1.508-.326 2.872-.977 4.095a7.367 7.367 0 01-2.69 2.841C33.69 22.663 32.428 23 31.023 23zm.06-2.476c.857 0 1.62-.224 2.293-.672.672-.468 1.201-1.11 1.589-1.925.386-.835.58-1.792.58-2.872 0-1.08-.194-2.027-.58-2.841-.388-.836-.917-1.477-1.59-1.925a3.911 3.911 0 00-2.291-.703H30.9c-1.304 0-2.373.51-3.209 1.528-.814.998-1.222 2.312-1.222 3.941 0 1.63.407 2.954 1.222 3.972.835.998 1.905 1.497 3.209 1.497h.183zM12.053 23c-2.037 0-3.82-.469-5.348-1.406-1.507-.957-2.668-2.271-3.483-3.941S2 14.098 2 12c0-2.098.407-3.982 1.222-5.653.835-1.67 2.017-2.974 3.545-3.91C8.294 1.478 10.057 1 12.053 1c1.609 0 3.055.316 4.338.947 1.304.611 2.363 1.477 3.178 2.597.815 1.1 1.304 2.374 1.467 3.82h-3.117c-.244-1.365-.876-2.465-1.894-3.3-1.019-.856-2.302-1.283-3.85-1.283h-.245c-1.385 0-2.597.356-3.636 1.069-1.039.713-1.833 1.69-2.383 2.933-.55 1.243-.825 2.648-.825 4.217 0 1.568.275 2.974.825 4.216.55 1.243 1.344 2.22 2.383 2.934 1.04.713 2.251 1.07 3.636 1.07h.245c1.548 0 2.831-.418 3.85-1.254 1.039-.855 1.68-1.976 1.925-3.36h3.086c-.184 1.446-.683 2.729-1.497 3.85-.795 1.12-1.844 1.996-3.148 2.627-1.303.611-2.75.917-4.338.917z" />
              </svg>
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/googlegemini/ffffff" alt="Gemini" />
            </span>
          </div>

          <div className="marquee-row" aria-hidden="true">
            <span className="logo">
              <img src="https://cdn.simpleicons.org/anthropic/ffffff" alt="" />
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/anthropic/ffffff" alt="" />
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/cursor/ffffff" alt="" />
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/github/ffffff" alt="" />
            </span>

            <span className="logo" style={{ color: '#f5f5f4' }}>
              <svg fill="currentColor" height="22" viewBox="0 0 91 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
                <path d="M79.915 14.964l-5.53-7.548h3.33l3.88 5.256 3.88-5.256h3.24l-5.5 7.486 5.683 7.792h-3.361l-4.003-5.5-4.064 5.5H74.2l5.715-7.73zM66.368 23c-1.345 0-2.567-.326-3.667-.978-1.08-.652-1.935-1.579-2.567-2.78-.631-1.203-.947-2.608-.947-4.217 0-1.59.316-2.974.947-4.156.652-1.202 1.518-2.129 2.597-2.78 1.08-.652 2.272-.978 3.575-.978 1.813 0 3.33.55 4.553 1.65 1.222 1.1 1.956 2.597 2.2 4.491.082.693.112 1.477.092 2.353H62.09c.06 1.548.489 2.76 1.283 3.636.815.876 1.793 1.314 2.933 1.314h.184c.855 0 1.599-.224 2.23-.672.632-.448 1.06-1.06 1.284-1.833h2.933a6.147 6.147 0 01-2.322 3.575C69.433 22.54 68.018 23 66.368 23zm3.819-9.687c-.082-1.16-.469-2.077-1.161-2.75-.693-.692-1.558-1.038-2.597-1.038h-.214c-.978 0-1.844.315-2.597.947-.734.611-1.212 1.558-1.437 2.841h8.006zM47.834 23c-1.324 0-2.516-.326-3.575-.978-1.039-.652-1.854-1.579-2.444-2.78-.591-1.202-.887-2.598-.887-4.187 0-1.588.306-2.984.917-4.186.611-1.201 1.446-2.128 2.506-2.78 1.08-.652 2.281-.978 3.605-.978 1.08 0 2.047.224 2.903.672.855.449 1.497 1.019 1.925 1.711V1.306h2.903v21.388h-2.903v-2.108c-.408.672-1.06 1.242-1.956 1.711-.896.469-1.894.703-2.994.703zm.58-2.475c.856 0 1.62-.234 2.292-.703.672-.468 1.192-1.11 1.558-1.925.387-.835.58-1.782.58-2.841 0-1.06-.193-1.997-.58-2.812-.366-.835-.886-1.487-1.558-1.955a3.911 3.911 0 00-2.292-.703h-.183c-1.304 0-2.363.51-3.178 1.528-.794 1.018-1.191 2.332-1.191 3.941 0 1.61.397 2.924 1.191 3.942.815 1.019 1.874 1.528 3.178 1.528h.183zM31.022 23c-1.406 0-2.679-.337-3.82-1.009a7.367 7.367 0 01-2.688-2.841c-.652-1.223-.978-2.587-.978-4.095 0-1.507.326-2.862.978-4.064.651-1.222 1.548-2.17 2.688-2.841 1.141-.693 2.414-1.04 3.82-1.04 1.405 0 2.668.347 3.789 1.04 1.14.672 2.037 1.62 2.688 2.841.652 1.202.978 2.557.978 4.064 0 1.508-.326 2.872-.977 4.095a7.367 7.367 0 01-2.69 2.841C33.69 22.663 32.428 23 31.023 23zm.06-2.476c.857 0 1.62-.224 2.293-.672.672-.468 1.201-1.11 1.589-1.925.386-.835.58-1.792.58-2.872 0-1.08-.194-2.027-.58-2.841-.388-.836-.917-1.477-1.59-1.925a3.911 3.911 0 00-2.291-.703H30.9c-1.304 0-2.373.51-3.209 1.528-.814.998-1.222 2.312-1.222 3.941 0 1.63.407 2.954 1.222 3.972.835.998 1.905 1.497 3.209 1.497h.183zM12.053 23c-2.037 0-3.82-.469-5.348-1.406-1.507-.957-2.668-2.271-3.483-3.941S2 14.098 2 12c0-2.098.407-3.982 1.222-5.653.835-1.67 2.017-2.974 3.545-3.91C8.294 1.478 10.057 1 12.053 1c1.609 0 3.055.316 4.338.947 1.304.611 2.363 1.477 3.178 2.597.815 1.1 1.304 2.374 1.467 3.82h-3.117c-.244-1.365-.876-2.465-1.894-3.3-1.019-.856-2.302-1.283-3.85-1.283h-.245c-1.385 0-2.597.356-3.636 1.069-1.039.713-1.833 1.69-2.383 2.933-.55 1.243-.825 2.648-.825 4.217 0 1.568.275 2.974.825 4.216.55 1.243 1.344 2.22 2.383 2.934 1.04.713 2.251 1.07 3.636 1.07h.245c1.548 0 2.831-.418 3.85-1.254 1.039-.855 1.68-1.976 1.925-3.36h3.086c-.184 1.446-.683 2.729-1.497 3.85-.795 1.12-1.844 1.996-3.148 2.627-1.303.611-2.75.917-4.338.917z" />
              </svg>
            </span>

            <span className="logo">
              <img src="https://cdn.simpleicons.org/googlegemini/ffffff" alt="" />
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section" id="try-agent">
      <div className="section-head">
        <h2>Give the scraper LLM a try.</h2>
        <p>This is the agent loop webrain runs: a plain-language prompt, seventeen intent-based tools, and structured JSON back. Presets show illustrative output, except the drone one: a real 1m43s run. Pick a demo or type your own prompt.</p>
      </div>

      <div className="try">
        <div className="try-bar">
          <span className="term-dots">
            <i />

            <i />

            <i />
          </span>

          <span className="try-title">webrain · agent playground</span>
          <span className="try-live"><i />live</span>
        </div>

        <div className="try-presets" role="tablist" aria-label="Demo presets">
          <button className="try-preset active" data-demo="prices" role="tab" aria-selected="true" onClick={(e)=>{const k=e.currentTarget.getAttribute('data-demo');const shell=e.currentTarget.closest('.try');shell.querySelectorAll('.try-preset').forEach(b=>{const on=b===e.currentTarget;b.classList.toggle('active',on);b.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.run&&window.__webrain.run(k,null);}}>Scrape prices</button>
          <button className="try-preset" data-demo="auth" role="tab" aria-selected="false" onClick={(e)=>{const k=e.currentTarget.getAttribute('data-demo');const shell=e.currentTarget.closest('.try');shell.querySelectorAll('.try-preset').forEach(b=>{const on=b===e.currentTarget;b.classList.toggle('active',on);b.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.run&&window.__webrain.run(k,null);}}>Auth + Turnstile</button>
          <button className="try-preset" data-demo="batch" role="tab" aria-selected="false" onClick={(e)=>{const k=e.currentTarget.getAttribute('data-demo');const shell=e.currentTarget.closest('.try');shell.querySelectorAll('.try-preset').forEach(b=>{const on=b===e.currentTarget;b.classList.toggle('active',on);b.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.run&&window.__webrain.run(k,null);}}>Batch interact</button>
          <button className="try-preset" data-demo="watch" role="tab" aria-selected="false" onClick={(e)=>{const k=e.currentTarget.getAttribute('data-demo');const shell=e.currentTarget.closest('.try');shell.querySelectorAll('.try-preset').forEach(b=>{const on=b===e.currentTarget;b.classList.toggle('active',on);b.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.run&&window.__webrain.run(k,null);}}>Watch video</button>
          <button className="try-preset" data-demo="serp" role="tab" aria-selected="false" onClick={(e)=>{const k=e.currentTarget.getAttribute('data-demo');const shell=e.currentTarget.closest('.try');shell.querySelectorAll('.try-preset').forEach(b=>{const on=b===e.currentTarget;b.classList.toggle('active',on);b.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.run&&window.__webrain.run(k,null);}}>SERP search</button>
          <button className="try-preset" data-demo="drone" role="tab" aria-selected="false" onClick={(e)=>{const k=e.currentTarget.getAttribute('data-demo');const shell=e.currentTarget.closest('.try');shell.querySelectorAll('.try-preset').forEach(b=>{const on=b===e.currentTarget;b.classList.toggle('active',on);b.setAttribute('aria-selected',on);});window.__webrain&&window.__webrain.run&&window.__webrain.run(k,null);}}>Real run · drone build</button>
        </div>

        <div className="try-prompt">
          <span className="term-prompt">❯</span>

          <input className="try-input" type="text" placeholder="scrape product prices from shop.example.com" aria-label="Prompt for the scraper agent" onKeyDown={(e)=>{if(e.key==='Enter'){e.preventDefault();window.__webrain&&window.__webrain.run&&window.__webrain.run(null,e.currentTarget.value);}}} />

          <button className="try-go" onClick={(e)=>{const shell=e.currentTarget.closest('.try');const input=shell.querySelector('.try-input');window.__webrain&&window.__webrain.run&&window.__webrain.run(null,input?input.value:'');}}>Run</button>
        </div>

        <div className="try-body">
          <div className="try-console" aria-live="polite">
            <div className="try-lines">
              <div className="try-line try-ask"><span className="term-prompt">❯</span><span className="try-type">“scrape product prices from shop.example.com”</span></div>
              <div className="try-line"><span className="term-prompt">❯</span><code>webrain\_navigate</code><span className="try-ok">→ ok · 0 challenges</span></div>
              <div className="try-line"><span className="term-prompt">❯</span><code>webrain\_observe · what=state</code><span className="try-ok">→ 24 product cards detected</span></div>
              <div className="try-line"><span className="term-prompt">❯</span><code>webrain\_extract · mode=autoschema</code><span className="try-ok">→ schema</span></div>
              <div className="try-line"><span className="term-prompt">❯</span><code>webrain\_extract · mode=schema</code><span className="try-ok">→ 42 rows</span></div>
            </div>

            <div className="try-card">
              <div className="try-card-head"><span>result.json</span><span className="try-card-tag">42 items</span></div>

              <pre>
                {`[ { "title": "USB-C Hub", "price": 42.90 }, { "title": "Wireless Charger", "price": 29.99 }, … 40 more ]`}
              </pre>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>From install to scraping in three steps.</h2>
        <p>No selectors to hand-write, no daemon, no driver wiring. The binary, your client, and the model do the rest.</p>
      </div>

      <div className="steps">
        <svg className="steps-flow" viewBox="0 0 300 100" fill="none" aria-hidden="true" preserveAspectRatio="none">
          <path className="steps-line" d="M22 14 H278" />

          <path className="steps-packet" d="M0 -3.4 a3.4 3.4 0 1 1 0 6.8 a3.4 3.4 0 1 1 0 -6.8" />
        </svg>

        <div className="step">
          <span className="step-label">Install</span>
          <h3>One binary, any OS</h3>
          <p>Install webrain once. No Node, no Python, no Docker. Engines download on demand.</p>
          <div className="step-term"><span className="step-term-bar"><i /><i /><i /><span>shell</span></span><code>curl -fsSL …/install.sh | bash</code></div>
        </div>

        <div className="step">
          <span className="step-label">Connect</span>
          <h3>Register it in a client</h3>
          <p>Add two lines to Claude, Cursor, Copilot, or Codex. The client spawns <code>webrain mcp</code>.</p>
          <div className="step-term"><span className="step-term-bar"><i /><i /><i /><span>mcp.json</span></span><code>{'{"webrain": { "command": "webrain", "args": ["mcp"] }}'}</code></div>
        </div>

        <div className="step">
          <span className="step-label">Ask</span>
          <h3>Point the model at the web</h3>
          <p>Tell the agent what to do in plain language. It navigates, extracts, and returns structured data.</p>
          <div className="step-term"><span className="step-term-bar"><i /><i /><i /><span>agent</span></span><code>scrape product prices from URL X</code></div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>One loop, every site.</h2>
        <p>Read the page, pick a tool, act, hand back structured JSON. The agent walks the same circuit on every job.</p>
      </div>

      <div className="loop">
        <div className="loop-radar" aria-hidden="true" />

        <svg className="loop-circuit" viewBox="0 0 760 460" fill="none" aria-hidden="true">
          <path className="loop-arc" d="M380 80 A150 150 0 0 1 522.6 183.6" />

          <path className="loop-arc" d="M522.6 183.6 A150 150 0 0 1 468.2 351.4" />

          <path className="loop-arc" d="M468.2 351.4 A150 150 0 0 1 291.8 351.4" />

          <path className="loop-arc" d="M291.8 351.4 A150 150 0 0 1 237.4 183.6" />

          <path className="loop-arc" d="M237.4 183.6 A150 150 0 0 1 380 80" />

          <path className="loop-inner" d="M380 140 a90 90 0 1 1 0 180 a90 90 0 1 1 0 -180" />

          <path className="loop-hub-ring" d="M380 184 a46 46 0 1 1 0 92 a46 46 0 1 1 0 -92" />

          <path className="loop-hub-ring loop-hub-ring-2" d="M380 196 a34 34 0 1 1 0 68 a34 34 0 1 1 0 -68" />

          <path className="loop-track" d="M380 80 a150 150 0 1 1 0 300 a150 150 0 1 1 0 -300" />

          <path className="loop-track" d="M380 140 a90 90 0 1 0 0 180 a90 90 0 1 0 0 -180" />

          <path className="loop-particle" d="M0 -4 a4 4 0 1 1 0 8 a4 4 0 1 1 0 -8" />

          <path className="loop-particle loop-particle-2" d="M0 -2.6 a2.6 2.6 0 1 1 0 5.2 a2.6 2.6 0 1 1 0 -5.2" />
        </svg>

        <div className="loop-node" style={{ left: '50%', top: '17.4%' }} data-node="0"><b>ask</b><span>plain-language prompt</span></div>
        <div className="loop-node" style={{ left: '68.8%', top: '39.9%' }} data-node="1"><b>navigate</b><span>engine loads the page</span></div>
        <div className="loop-node" style={{ left: '61.6%', top: '76.4%' }} data-node="2"><b>observe</b><span>DOM snapshot</span></div>
        <div className="loop-node" style={{ left: '38.4%', top: '76.4%' }} data-node="3"><b>decide</b><span>LLM picks the tool</span></div>
        <div className="loop-node" style={{ left: '31.2%', top: '39.9%' }} data-node="4"><b>extract</b><span>structured JSON out</span></div>
        <div className="loop-hub"><b>webrain</b><span>one binary</span></div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>Everything an agent needs to read the web.</h2>
        <p>Seventeen intent-based tools cover the full job. No selectors to hand-write, no driver plumbing, no daemon.</p>
      </div>

      <div className="bento">
        <div className="shell card-2">
          <div className="core core-grad">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><rect x="3" y="3" width="7" height="7" rx="1.5" /><rect x="14" y="3" width="7" height="7" rx="1.5" /><rect x="3" y="14" width="7" height="7" rx="1.5" /><rect x="14" y="14" width="7" height="7" rx="1.5" /></svg></span>17 intent-based tools</h3>
            <p>One tool per intent, each with a <code>what</code>, <code>action</code>, <code>op</code>, or <code>mode</code> selector, and every legacy one-action alias still dispatches.</p>
            <div className="agent-mini" aria-hidden="true"><span className="am-seg">agent</span><span className="am-arrow">→</span><span className="am-seg">navigate</span><span className="am-arrow">→</span><span className="am-seg">observe</span><span className="am-arrow">→</span><span className="am-seg">extract</span><span className="am-arrow">→</span><span className="am-seg am-json">JSON</span><span className="am-cursor" /></div>

            <div className="tool-chips">
              <a className="tool-chip" href="/reference/tools">navigate</a><a className="tool-chip" href="/reference/tools">observe</a><a className="tool-chip" href="/reference/tools">interact</a><a className="tool-chip" href="/reference/tools">extract</a><a className="tool-chip" href="/reference/tools">scrape</a><a className="tool-chip" href="/reference/tools">batch</a><a className="tool-chip" href="/reference/tools">crawl</a><a className="tool-chip" href="/reference/tools">search</a><a className="tool-chip" href="/reference/tools">serp</a><a className="tool-chip" href="/reference/tools">pdf</a><a className="tool-chip" href="/reference/tools">download</a><a className="tool-chip" href="/reference/tools">watch</a><a className="tool-chip" href="/reference/tools">session</a><a className="tool-chip" href="/reference/tools">vision</a><a className="tool-chip" href="/reference/tools">eval</a><a className="tool-chip" href="/reference/tools">guide</a>
            </div>
          </div>
        </div>

        <div className="shell">
          <div className="core">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M8 6h13M8 12h13M8 18h13" /><path d="M3 6h.01M3 12h.01M3 18h.01" /></svg></span>Structured extraction</h3>
            <p>Autoschema probes the DOM, then schema, regex, table, JSON-LD, and BM25 modes return clean data. Zero LLM, zero cost. Live: 407 products from a real store in \~17 tool calls.</p>
            <div className="cap-tags"><a className="tool-chip" href="/reference/tools">autoschema</a><a className="tool-chip" href="/reference/tools">schema</a><a className="tool-chip" href="/reference/tools">regex</a><a className="tool-chip" href="/reference/tools">table</a><a className="tool-chip" href="/reference/tools">jsonld</a><a className="tool-chip" href="/reference/tools">bm25</a></div>
          </div>
        </div>

        <div className="shell">
          <div className="core">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><rect x="3" y="11" width="18" height="10" rx="2" /><path d="M7 11V7a5 5 0 0 1 10 0v4" /></svg></span>Stealth login</h3>
            <p>Real-Chrome profiles with an encrypted local vault and optional TOTP. Cookies transfer across engines.</p>
            <div className="cap-tags"><span className="tool-chip">AES-256-GCM</span><span className="tool-chip">TOTP</span><span className="tool-chip">cookie transfer</span></div>
          </div>
        </div>

        <div className="shell">
          <div className="core">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2 4 6v6c0 5 3.4 8.4 8 10 4.6-1.6 8-5 8-10V6l-8-4Z" /><path d="m9 12 2 2 4-4" /></svg></span>Challenge bypass</h3>
            <p>Every navigate reports a <code>challenge</code> field; real Chrome with a persistent profile and native login clears Cloudflare, Turnstile, and reCAPTCHA gates. No Python sidecar.</p>
            <div className="cap-tags"><span className="tool-chip">cloudflare\_challenge</span><span className="tool-chip">blocked</span><span className="tool-chip">captcha</span></div>
          </div>
        </div>

        <div className="shell">
          <div className="core">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 3v18M3 12h18" /></svg></span>Crawl at scale</h3>
            <p>Batch, spider, sitemap, and scan modes with auto-throttle and checkpoint/resume. 132 products in one parallel call, \~2-4 s/page on Lightpanda.</p>
            <div className="cap-tags"><a className="tool-chip" href="/reference/tools">batch</a><a className="tool-chip" href="/reference/tools">spider</a><a className="tool-chip" href="/reference/tools">sitemap</a><a className="tool-chip" href="/reference/tools">scan</a></div>

            <svg className="crawl-vis" viewBox="0 0 120 120" fill="none" aria-hidden="true">
              <path className="crawl-ring" fill="none" d="M60 14 a46 46 0 1 1 0 92 a46 46 0 1 1 0 -92" />

              <path className="crawl-ring" fill="none" d="M60 30 a30 30 0 1 1 0 60 a30 30 0 1 1 0 -60" />

              <path className="crawl-ring" fill="none" d="M60 45 a15 15 0 1 1 0 30 a15 15 0 1 1 0 -30" />

              <path className="crawl-ray" fill="none" d="M14 60 L106 60" />

              <path className="crawl-ray" fill="none" d="M60 14 L60 106" />

              <path className="crawl-ray" fill="none" d="M27 27 L93 93" />

              <path className="crawl-ray" fill="none" d="M93 27 L27 93" />

              <path className="crawl-core" d="M60 57 a3 3 0 1 1 0 6 a3 3 0 1 1 0 -6" />

              <path className="crawl-node" d="M106 57.5 a2.5 2.5 0 1 1 0 5 a2.5 2.5 0 1 1 0 -5" />

              <path className="crawl-node" d="M27 24.5 a2.5 2.5 0 1 1 0 5 a2.5 2.5 0 1 1 0 -5" />

              <path className="crawl-node" d="M93 90.5 a2.5 2.5 0 1 1 0 5 a2.5 2.5 0 1 1 0 -5" />
            </svg>
          </div>
        </div>

        <div className="shell">
          <div className="core core-art">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><circle cx="12" cy="12" r="9" /><path d="m12 7 5 5-5 5M7 12h10" /></svg></span>Read anything</h3>
            <p>PDF extract and render, video transcripts plus frames, downloads, JSON-LD, media, and a no-browser HTTP path. Video transcripts run fully offline with bundled whisper and local vision.</p>
            <div className="cap-tags"><a className="tool-chip" href="/reference/tools">PDF</a><a className="tool-chip" href="/reference/tools">video</a><a className="tool-chip" href="/reference/tools">downloads</a><a className="tool-chip" href="/reference/tools">JSON-LD</a><a className="tool-chip" href="/reference/tools">HTTP</a></div>
          </div>
        </div>

        <div className="shell card-2">
          <div className="core core-grad">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2a3 3 0 0 0-3 3v2H6a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3V5a3 3 0 0 0-3-3Z" /><circle cx="12" cy="15" r="2.4" /></svg></span>Local AI, all OS</h3>
            <p>Bundled whisper-cli for transcripts and Qwen3-VL-2B for vision. No cloud key required. Runs fully on your machine.</p>
            <div className="cap-tags"><span className="tool-chip">whisper-cli</span><span className="tool-chip">Qwen3-VL-2B</span></div>

            <div className="stat-row">
              <div className="stat"><b>1</b><span>static binary</span></div>
              <div className="stat"><b>3</b><span>browser engines</span></div>
              <div className="stat"><b>16</b><span>MCP tools</span></div>
              <div className="stat"><b>0</b><span>Node runtime</span></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>Skills, recipes, and agent prompts, in the repo.</h2>
        <p>webrain ships a working agent playbook, not just tools: a routing skill, verified block-bypass workflows, and a ready-to-copy news-research prompt. Clone the repo and load them into any client.</p>
      </div>

      <div className="playbook">
        <div className="shell playbook-hub">
          <div className="core core-grad">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20" /><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2Z" /></svg></span>webrain skill</h3>
            <p className="hub-lede">The router. Load it and it picks the browser, the challenge path, and the extractor for each task, <code>mcp\_webrain-\*</code> without guesswork.</p>

            <div className="route-map" aria-hidden="true">
              <div className="route-node"><b>prompt</b><span>any plain-language ask</span></div>

              <svg className="route-path" viewBox="0 0 200 60" fill="none">
                <path className="route-line" d="M10 30 H150" />

                <path className="route-packet" d="M0 -3 a3 3 0 1 1 0 6 a3 3 0 1 1 0 -6" />
              </svg>

              <div className="route-node"><b>decide</b><span>LLM + rule fallback</span></div>

              <svg className="route-path" viewBox="0 0 200 60" fill="none">
                <path className="route-line" d="M10 30 H150" />

                <path className="route-packet" d="M0 -3 a3 3 0 1 1 0 6 a3 3 0 1 1 0 -6" />
              </svg>

              <div className="route-node"><b>browser · extractor</b><span>three engines, one CDP</span></div>
            </div>

            <div className="cap-tags"><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain">SKILL.md</a></div>
          </div>
        </div>

        <div className="playbook-side">
          <div className="shell">
            <div className="core">
              <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" /></svg></span>Workflows</h3>
              <p>Verified block-bypass recipes: CAPTCHA geometry, feed & news aggregation past WAFs, protected-site end-to-end.</p>
              <div className="cap-tags"><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/workflows">captcha-solve</a><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/workflows">feed-and-news</a><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/workflows">protected-site</a></div>
            </div>
          </div>

          <div className="shell">
            <div className="core">
              <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="m4 17 6-6-6-6" /><path d="M12 19h8" /></svg></span>Agent prompts</h3>
              <p>A ready news-research agent: copy the prompt into any chat for the optimal tool order and a precise bypass playbook.</p>
              <div className="cap-tags"><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/prompts">news-research-agent</a></div>
            </div>
          </div>

          <div className="shell">
            <div className="core">
              <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="m12 2 10 6.5L12 15 2 8.5 12 2Z" /><path d="m2 12.5 10 6.5 10-6.5" /></svg></span>References</h3>
              <p>Depth for every decision: browser selection, challenge handling, persistent profiles, extraction matrix, anti-patterns.</p>
              <div className="cap-tags"><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/references">browser-selection</a><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/references">challenges</a><a className="tool-chip" href="https://github.com/prokopis3/webrain/tree/main/skills/webrain/references">extraction</a></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section section-proof">
      <div className="section-head">
        <h2>Proven on real jobs.</h2>
        <p>Measured on live sites and documented in the repo. No invented numbers, no benchmark theater.</p>
      </div>

      <div className="bench-stats">
        <div className="bench-stat"><b data-count="407"><em className="num">407</em></b><span>unique products from a live store in \~17 tool calls, \~46K tokens</span></div>
        <div className="bench-stat"><b data-count="132"><em className="num">132</em></b><span>products in one parallel batch call, zero logins</span></div>
        <div className="bench-stat"><b data-count="3"><em className="num">3</em></b><span>browser engines behind one CDP backend, plus a no-browser HTTP path</span></div>
        <div className="bench-stat"><b data-count="0"><em className="num">0</em></b><span>runtime dependencies. One \~22 MB Rust binary on macOS, Linux, and Windows</span></div>
      </div>

      <div className="bench-bars">
        <div className="bar-row">
          <div className="bar-name">Agent loop · 407 products</div>

          <div className="bar-track">
            <div className="bar-fill" data-w="100" style={{ '--fill': '100%', background: 'linear-gradient(90deg,#0e5f78,#38f0ff)' }} />
          </div>

          <div className="bar-val"><b data-tv="46000">46,000</b><span>tokens</span></div>
        </div>

        <div className="bar-row">
          <div className="bar-name">Structured extract · zero LLM</div>

          <div className="bar-track">
            <div className="bar-fill" data-w="1" style={{ '--fill': '1%', background: 'linear-gradient(90deg,#6b4bd8,#ff5da8)' }} />
          </div>

          <div className="bar-val"><b>0</b><span>tokens</span></div>
        </div>

        <p className="proven-note">Same store, same 407 products. The extraction engine does the work with no LLM in the loop: zero tokens, zero cost per row.</p>
      </div>

      <p className="proven-note">Reproduce the zero-LLM claim on any site: <code>webrain\_extract · mode=autoschema</code> → <code>mode=schema</code>. No LLM, no tokens.</p>
      <p className="proven-note"><b>Real operations, end to end.</b> Two full agent jobs. Every number from the run, not a demo.</p>

      <div className="bento">
        <div className="shell">
          <div className="core">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><rect x="4" y="4" width="16" height="16" rx="2" /><rect x="9" y="9" width="6" height="6" /><path d="M9 1v3M15 1v3M9 20v3M15 20v3M1 9h3M1 15h3M20 9h3M20 15h3" /></svg></span>Buy a machine for Qwen3.8</h3>
            <p>Live skroutz.gr op: navigate 4 targets, batch 2 search pages, eval the benchmark tables, rank by €/tok/s.</p>
            <div className="cap-tags"><span className="tool-chip">16 tool calls</span><span className="tool-chip">0 challenges</span><span className="tool-chip">100% price match</span><span className="tool-chip">\~\$0.04</span></div>
            <p>Verdict → <b>Acer Predator Helios 16 AI</b> · 3.699 €, <b>\~100 t/s</b> on Qwen3.8-27B Q4 (interpolated)</p>
          </div>
        </div>

        <div className="shell">
          <div className="core">
            <h3><span className="chip-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><circle cx="5" cy="5" r="1.4" /><circle cx="19" cy="5" r="1.4" /><circle cx="5" cy="19" r="1.4" /><circle cx="19" cy="19" r="1.4" /><path d="M6.4 5h11.2M5 6.4v11.2M19 6.4v11.2M6.4 19h11.2" /></svg></span>Plan a drone build</h3>
            <p>Multi-source research: serp discovery → one batch over 6 build guides + firmware repos → a synthesized parts-and-code plan.</p>
            <div className="cap-tags"><span className="tool-chip">2× webrain\_serp</span><span className="tool-chip">6 sources · one batch</span><span className="tool-chip">1m43s</span><span className="tool-chip">DeepSeek V4 Flash</span></div>
            <p>Output → <b>12-part list</b> · \$500-650, <b>Betaflight / INAV / ArduPilot</b> + STM32 KiCad repo</p>
          </div>
        </div>
      </div>

      <p className="proven-note">Every figure is in the repo: the <a href="/guides/agent-decision-guide">agent guide</a>, the <a href="https://github.com/prokopis3/webrain">changelog</a></p>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>Structured search. Five engines, one tool.</h2>
        <p>Ask for results and get typed JSON: position, title, url, domain, snippet. duckduckgo and bing answer over plain HTTP with no browser at all; google and brave render in the connected engine; auto fetches duckduckgo + bing in parallel over plain HTTP and merges them — relevance-filtered and deduped (google and brave join the merge when a CDP engine is attached).</p>
      </div>

      <div className="serp">
        <div className="serp-copy">
          <div className="serp-caps">
            <div className="serp-cap"><code>typed results</code><span>position, title, url, domain, snippet</span></div>
            <div className="serp-cap"><code>five engines + auto</code><span>duckduckgo, bing, google, brave, auto</span></div>
            <div className="serp-cap"><code>fallback + dedupe</code><span>providers fall back, duplicate URLs dropped</span></div>
            <div className="serp-cap"><code>pagination + safe + region</code><span>page offsets, safe search, en-US market default</span></div>
            <div className="serp-cap"><code>proxy + captcha solve</code><span>route engines through HTTP(S)/SOCKS proxies; 2captcha /sorry auto-solve</span></div>
            <div className="serp-cap"><code>request\_id + retry</code><span>correlate every call, retry with backoff</span></div>
          </div>

          <p className="proven-note">One MCP tool and one CLI command: <a href="/reference/tools">webrain\_serp</a> and <a href="/reference/cli">webrain serp</a>.</p>
        </div>

        <div className="serp-term term">
          <div className="term-bar">
            <span className="term-dots">
              <i />

              <i />

              <i />
            </span>

            <span className="term-title">webrain · serp</span>
            <span className="term-live"><i />live</span>
          </div>

          <div className="serp-term-body term-body">
            <div className="serp-lines">
              <div className="term-line serp-ask"><span className="term-prompt">❯</span><span>“tokio rust” · engine=duckduckgo · limit=5</span></div>
              <div className="term-line"><span className="term-prompt">❯</span><code>webrain\_serp · engine=duckduckgo</code></div>
              <div className="term-line"><span className="term-ok">✓</span><span>duckduckgo · plain HTTP · no browser</span></div>
              <div className="term-line"><span className="term-ok">✓</span><span>deduped · 5 unique results · 0.9s</span><span className="serp-cursor" /></div>
            </div>

            <div className="serp-results">
              <div className="serp-row">
                <span className="serp-rank">1</span>
                <div className="serp-row-main"><b>Rust Programming Language</b><span className="serp-url">rust-lang.org</span><span className="serp-snip">A fast, reliable, and productive programming language.</span></div>
              </div>

              <div className="serp-row">
                <span className="serp-rank">2</span>
                <div className="serp-row-main"><b>Rust (programming language) - Wikipedia</b><span className="serp-url">en.wikipedia.org</span><span className="serp-snip">A general-purpose language emphasizing performance, type safety, concurrency, and memory safety.</span></div>
              </div>

              <div className="serp-row">
                <span className="serp-rank">3</span>
                <div className="serp-row-main"><b>The Rust Programming Language</b><span className="serp-url">doc.rust-lang.org</span><span className="serp-snip">The official Rust book: performance, safety, and fearless concurrency.</span></div>
              </div>
            </div>

            <div className="serp-json">
              <div className="serp-json-head"><span>result.json</span><span className="serp-json-tag">5 items</span></div>

              <pre>
                {'{ "position": 1, "title": "Rust Programming Language", "url": "https://rust-lang.org/", "domain": "rust-lang.org", "snippet": "…" }'}
              </pre>
            </div>

            <div className="serp-stats">
              <div className="serp-stat"><b data-count="5"><em className="num">5</em></b><span>engines behind one tool</span></div>
              <div className="serp-stat"><b data-count="2"><em className="num">2</em></b><span>browserless by default (duckduckgo · bing)</span></div>
              <div className="serp-stat"><b data-count="50"><em className="num">50</em></b><span>max results per call</span></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>One CDP backend, four ways to load a page.</h2>
        <p>Pick the right engine for the job. From a full Chrome for interactive SPAs to a no-browser HTTP fetch for static pages.</p>
      </div>

      <div className="engines">
        <div className="engine">
          <img className="engine-logo" src="https://cdn.simpleicons.org/googlechrome/ffffff" alt="Chrome" width="32" height="32" />

          <div><h3>Chrome</h3><p>Interactive SPAs, challenges, screenshots. Anything real Chrome can do.</p></div>
          <span className="tag">Default</span>
        </div>

        <div className="engine">
          <img className="engine-logo" src="https://mintcdn.com/webrain/XwegLRJ91GgkXGv_/images/landing/obscura-logo.png?fit=max&auto=format&n=XwegLRJ91GgkXGv_&q=85&s=c24cbbf6b95180b3845051692365432e" alt="Obscura" width="36" height="36" style={{objectFit:'contain'}} data-path="images/landing/obscura-logo.png" />

          <div><h3>Obscura</h3><p>Fast batch scraping of non-challenged JS pages. No paint engine, no screenshots.</p></div>
          <span className="tag">Fast</span>
        </div>

        <div className="engine">
          <img className="engine-logo" src="https://mintcdn.com/webrain/XwegLRJ91GgkXGv_/images/landing/lightpanda-logo.svg?fit=max&auto=format&n=XwegLRJ91GgkXGv_&q=85&s=ff66fbcfae54feea5b9f4fa384bc58ba" alt="Lightpanda" width="36" height="36" style={{objectFit:'contain',borderRadius:'8px',padding:'4px'}} data-path="images/landing/lightpanda-logo.svg" />

          <div><h3>Lightpanda</h3><p>Real accessibility tree, lightweight. Screenshot returns a placeholder frame.</p></div>
          <span className="tag">Light</span>
        </div>

        <div className="engine">
          <span className="engine-logo engine-logo-icon">
            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round">
              <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" />

              <path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" />
            </svg>
          </span>

          <div><h3>fetch\_http</h3><p>Static HTML, no JS, no auth. 10-100× faster. No engine at all.</p></div>
          <span className="tag">No browser</span>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="split">
        <div>
          <div className="section-head" style={{ marginBottom: 0 }}>
            <h2>Point any LLM at the web.</h2>
            <p>No driver wiring, no browser download dance, no tool wrappers. Install once, and your agent drives a real browser.</p>
          </div>

          <div className="check-list">
            <div className="check"><span className="tick"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.6" strokeLinecap="round" strokeLinejoin="round"><path d="m4 12 5 5L20 6" /></svg></span><div><b>MCP native</b><p>stdio or HTTP. Works with Claude, Cursor, Copilot, Codex, Gemini.</p></div></div>
            <div className="check"><span className="tick"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.6" strokeLinecap="round" strokeLinejoin="round"><path d="m4 12 5 5L20 6" /></svg></span><div><b>Local first</b><p>Everything runs on your machine. No cloud, no API key, no data leaves.</p></div></div>
            <div className="check"><span className="tick"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.6" strokeLinecap="round" strokeLinejoin="round"><path d="m4 12 5 5L20 6" /></svg></span><div><b>Stealth and auth built in</b><p>Challenge bypass, encrypted vault, TOTP, and cookie transfer across engines.</p></div></div>
          </div>
        </div>

        <div className="why-visual">
          <img src="https://mintcdn.com/webrain/XwegLRJ91GgkXGv_/images/landing/mcp-workflow-art.png?fit=max&auto=format&n=XwegLRJ91GgkXGv_&q=85&s=af0ed90595f1361bff64559e864029a0" alt="webrain MCP workflow: AI agent connects through MCP protocol to browser engine, extracts structured data" width="1376" height="768" data-path="images/landing/mcp-workflow-art.png" />
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>Say it plainly. The agent picks the tool.</h2>
        <p>No selectors, no wrappers. The model reads the page, reads the <code>challenge</code> field, and dispatches to the right tool. These are real pairings from the agent guide.</p>
      </div>

      <div className="ussay">
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_navigate</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Go to example.com, tell me what's there”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_observe</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“What's on this page?”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_interact</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Click Sign in and type the email”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_extract</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Extract prices as JSON”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_crawl</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Crawl the whole docs site”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_batch</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Scrape these 50 URLs”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_watch</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Get a transcript and frames of this video”</span></a>
        <a className="ussay-row" href="/guides/agent-decision-guide"><span className="ussay-tool">webrain\_session</span><span className="ussay-arr"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span><span className="ussay-prompt">“Log in and keep the session”</span></a>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>How it stacks up against the alternatives.</h2>
        <p>Honest, feature-by-feature comparisons against the tools you may already be using.</p>
      </div>

      <div className="compare-grid">
        <a className="compare" href="/comparisons/playwright">
          <div><b>vs Playwright</b><p>Why an MCP-native tool beats a driver library for LLM agents.</p></div>

          <span className="ico">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <path d="M5 12h14M13 6l6 6-6 6" />
            </svg>
          </span>
        </a>

        <a className="compare" href="/comparisons/firecrawl">
          <div><b>vs Firecrawl</b><p>Local-first and free versus a hosted API. Zero cloud, zero keys.</p></div>

          <span className="ico">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <path d="M5 12h14M13 6l6 6-6 6" />
            </svg>
          </span>
        </a>

        <a className="compare" href="/comparisons/browser-use">
          <div><b>vs Browser Use</b><p>One binary and real CDP engines instead of a Python agent loop.</p></div>

          <span className="ico">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <path d="M5 12h14M13 6l6 6-6 6" />
            </svg>
          </span>
        </a>

        <a className="compare" href="/comparisons/crawl4ai">
          <div><b>vs Crawl4AI</b><p>Rust-native extraction strategies and vision with no Python runtime.</p></div>

          <span className="ico">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <path d="M5 12h14M13 6l6 6-6 6" />
            </svg>
          </span>
        </a>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section">
      <div className="section-head">
        <h2>Questions, answered plainly.</h2>
        <p>The objections that come up before you install. The short version: yes, it runs on your machine.</p>
      </div>

      <div className="faq">
        <div className="faq-item">
          <h3>Do I need Node, Python, or Docker?</h3>
          <p>No. webrain is a single Rust binary. The browsers it drives (Chrome for Testing, Obscura, Lightpanda) download on demand into a cache dir. Nothing else to install.</p>
        </div>

        <div className="faq-item">
          <h3>Does it cost money or need an API key?</h3>
          <p>No. It is open source (MIT) and local-first. Cloud keys are optional and only for video transcriptions and vision; the bundled local whisper and Qwen3-VL-2B models work offline.</p>
        </div>

        <div className="faq-item">
          <h3>Which AI clients does it work with?</h3>
          <p>Any MCP client: Claude, Claude Code, Cursor, GitHub Copilot, Codex, Gemini, and more. Register it once in the client's MCP config and the model drives the browser itself.</p>
        </div>

        <div className="faq-item">
          <h3>How is this different from a scraping API?</h3>
          <p>webrain runs on your machine, sends no data to a third party, and gives the LLM a real browser with stealth and challenge bypass. For static pages it can be 10-100× faster than a full browser.</p>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="section" style={{ paddingTop: '1rem' }}>
      <div className="cta-band">
        <div className="cta-stream" aria-hidden="true" />

        <h2>Give your agent a browser in five minutes.</h2>
        <p>Install webrain, start the MCP server, and ask your LLM to scrape. No selectors, no wrappers.</p>

        <div className="cta-row">
          <a className="btn btn-primary" href="/quickstart">Get started<span className="ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6" /></svg></span></a>
        </div>
      </div>
    </div>
  </div>

  <div className="wrap">
    <div className="foot">
      <span>webrain</span>

      <div className="links">
        <a href="/overview">Docs</a>
        <a href="/reference/tools">Tools</a>
        <a href="/guides/agent-decision-guide">Agent Guide</a>
        <a href="/comparisons/playwright">vs Playwright</a>
        <a href="https://github.com/prokopis3/webrain">GitHub</a>
      </div>

      <div className="legal">© 2026 webrain · Open source (MIT). MCP server for browser automation and web scraping</div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js" />

  <script src="https://cdn.jsdelivr.net/gh/prokopis3/webrain@main/docs/styles/landing-anim.js" />
</div>