:root{--bg:#0a0a0a;--panel:#121316;--panel2:#17181c;--line:#23242a; --txt:#e8e8ea;--mut:#8a8d96;--accent:#00d4aa;--red:#ff5470;--amber:#ffb020;--green:#00d4aa;} *{box-sizing:border-box;margin:0;padding:0} body{background:var(--bg);color:var(--txt);font:16px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',Inter,Roboto,sans-serif;-webkit-font-smoothing:antialiased} a{color:var(--accent);text-decoration:none} .wrap{max-width:1080px;margin:0 auto;padding:0 20px} .mono{font-family:'SF Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace} nav{position:sticky;top:0;z-index:20;background:rgba(10,10,10,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)} nav .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;flex-wrap:wrap} .brand{font-weight:700;font-size:19px;letter-spacing:-.02em} .brand .dot{color:var(--accent)} .nav-links{display:flex;gap:22px;align-items:center;font-size:14px;flex-wrap:wrap} .nav-links a{color:var(--mut);min-height:44px;display:inline-flex;align-items:center}.nav-links a:hover{color:var(--txt)}.nav-links a.btn,.nav-links a.btn:hover,.nav-links a.btn:visited{color:#04120e}.nav-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:8px;color:var(--txt);width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .15s}.nav-toggle:hover{border-color:var(--accent)}.nav-toggle svg{width:24px;height:24px;flex:0 0 auto;display:block} .btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;background:var(--accent);color:#04120e;font-weight:700;padding:12px 22px;border-radius:10px;border:none;cursor:pointer;font-size:15px;transition:transform .1s} .btn:hover{transform:translateY(-1px)} .btn.ghost{background:transparent;color:var(--txt);border:1px solid var(--line)} section{padding:72px 0;border-bottom:1px solid var(--line)} .hero{padding:90px 0 80px;text-align:center;background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(0,212,170,.10),transparent)} .tag{display:inline-block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);border:1px solid rgba(0,212,170,.3);border-radius:100px;padding:6px 14px;margin-bottom:24px} h1{font-size:clamp(32px,6vw,56px);line-height:1.05;letter-spacing:-.03em;font-weight:800;margin-bottom:20px} h1 .hl{color:var(--red)} .sub{font-size:clamp(17px,2.4vw,21px);color:var(--mut);max-width:680px;margin:0 auto 34px} h2{font-size:clamp(26px,4vw,38px);letter-spacing:-.02em;margin-bottom:14px;font-weight:800} .lead{color:var(--mut);font-size:18px;max-width:640px;margin-bottom:40px} .center{text-align:center;margin:0 auto} .grid2{display:grid;grid-template-columns:1fr 1fr;gap:22px} .card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px} .card h3{font-size:18px;margin-bottom:10px} .tl{list-style:none;display:flex;flex-direction:column;gap:12px} .tl li{display:flex;gap:14px;align-items:flex-start;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px 16px} .tl .t{color:var(--mut);font-size:13px;min-width:52px;padding-top:2px} .badge{font-size:12px;font-weight:700;padding:3px 9px;border-radius:6px;white-space:nowrap} .b-red{background:rgba(255,84,112,.14);color:var(--red)} .b-green{background:rgba(0,212,170,.14);color:var(--green)} .b-amber{background:rgba(255,176,32,.14);color:var(--amber)} .contrast{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden} .contrast>div{padding:26px} .contrast .old{background:rgba(255,84,112,.05)} .contrast .new{background:rgba(0,212,170,.05)} .contrast h3{font-size:15px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px} .contrast ul{list-style:none;display:flex;flex-direction:column;gap:12px;font-size:15px} .contrast li{display:flex;gap:10px} .price{max-width:440px;margin:0 auto;background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid rgba(0,212,170,.3);border-radius:20px;padding:36px;text-align:center} .price .amt{font-size:52px;font-weight:800;letter-spacing:-.03em} .price .amt span{font-size:18px;color:var(--mut);font-weight:500} .price ul{list-style:none;text-align:left;margin:24px 0;display:flex;flex-direction:column;gap:12px} .price li{display:flex;gap:10px;color:var(--txt)} .price li .c{color:var(--accent)} .strike{color:var(--mut);text-decoration:line-through;font-size:15px} .codebox{background:#000;border:1px solid var(--line);border-radius:12px;padding:18px;overflow-x:auto;font-size:13.5px;color:#cfd2d8;text-align:left} .codebox .k{color:var(--accent)}.codebox .s{color:var(--amber)}.codebox .c{color:var(--mut)} .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px} .kpi{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center} .kpi .n{font-size:30px;font-weight:800;color:var(--accent)} .kpi .l{font-size:13px;color:var(--mut);margin-top:4px} footer{padding:40px 0;text-align:center;color:var(--mut);font-size:14px} .form{display:flex;gap:10px;max-width:440px;margin:18px auto 0} .form input{flex:1;background:var(--panel2);border:1px solid var(--line);color:var(--txt);padding:13px 15px;border-radius:10px;font-size:15px} .mt40{margin-top:40px}.mt24{margin-top:24px} .faq{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px;text-align:left} .faq details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px} .faq summary{font-weight:700;cursor:pointer;font-size:16px;list-style:none} .faq summary::-webkit-details-marker{display:none} .faq summary::before{content:"+ ";color:var(--accent);font-weight:800} .faq details[open] summary::before{content:"– "} .faq details p{color:var(--mut);margin-top:12px;font-size:15px} .doc{max-width:760px;margin:0 auto;text-align:left} .doc h1{font-size:clamp(28px,5vw,40px);margin-bottom:8px} .doc p,.doc li{color:var(--mut);font-size:16px;margin-bottom:12px} .doc h2{font-size:22px;margin:28px 0 10px} .doc .lead{color:var(--txt);font-size:18px} .deflist{max-width:760px;margin:8px auto 0;text-align:left} .deflist dt{font-weight:700;color:var(--accent);margin-top:16px;font-size:17px} .deflist dd{margin:6px 0 0;color:var(--mut);font-size:15px} .deflist code{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-family:'SF Mono',monospace;font-size:13px;color:var(--txt)} .cmp{width:100%;border-collapse:collapse;margin-top:20px;font-size:14.5px} .cmp th,.cmp td{border:1px solid var(--line);padding:12px 14px;text-align:left} .cmp thead th{background:var(--panel2);color:var(--txt);font-weight:700} .cmp tbody tr:nth-child(even){background:rgba(255,255,255,.02)} .cmp tbody tr:last-child{background:rgba(0,212,170,.06)} @media(max-width:760px){.grid2,.contrast,.kpis{grid-template-columns:1fr}.decision3{grid-template-columns:1fr!important}.nav-toggle{display:inline-flex}#mainnav{position:absolute;top:60px;left:0;right:0;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;background:rgba(10,10,10,.98);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:8px 20px 18px;gap:2px;display:none;z-index:30;max-height:calc(100dvh - 60px);overflow-y:auto}nav.menu-open #mainnav{display:flex}#mainnav a{width:100%;padding:10px 0;justify-content:flex-start}#mainnav a.btn{justify-content:center;margin-top:10px}#mainnav a:not(.btn){font-size:15px}section{padding:52px 0}.cmp{font-size:12.5px}.cmp th,.cmp td{padding:8px}}

Protected by sipi.bot

Show the world your autonomous agents are protected by a spend firewall. Every badge embed is a live status indicator — and a permanent backlink.

Full badge — live stats

● Live
Protected by sipi.bot

Flat badge — README

Protected by sipi.bot

Shield badge — Shields.io style

Protected by sipi.bot

Full badge — landing pages

Protected by sipi.bot

Where to embed the badge

GitHub README

Add the flat badge to your project README. Every visitor sees your agents are protected.

Documentation site

Embed the full badge in your docs sidebar. Builds trust with every integration partner.

Landing page footer

A single <img> tag in your footer. Zero JavaScript, zero dependencies, always current.

Agent framework integration page

Show users of your framework integration that you've wired the firewall. Trust signal.

Security / compliance page

Pair the badge with your security page. Every SOC 2 auditor and enterprise buyer sees it.

MCP server listing

Add the shield badge to your Smithery, MCPT, or Open Tools listing. Differentiates your listing.

Customization

Parameter Values Default Description
style dark, flat, shield dark Badge variant: full stats card, single-line, or Shields.io style
w 2801200 760 Width in pixels (full badge only)

What the badge shows

The badge pulls live stats from the sipi.bot firewall engine. Every number is real — checks counted today, blocked transactions, approved/flagged breakdowns. No fake data, no cached static badge.

Real-time stats
30-second refresh from live firewall
Zero dependencies
One <img> tag, no JS needed
🔒
Always HTTPS
Served from sipi.bot CDN with HSTS
Free forever
No API key, no rate limit on badge

Frequently asked

Does the badge slow down my page?

No. The SVG payload is ~2KB, served with 30-second CDN cache. It loads in parallel with your page and never blocks rendering.

Do I need a sipi.bot account?

No. The badge is free for anyone to embed. It shows global firewall stats, not account-specific data. If you want a badge showing YOUR agent's protected status, sign up for a plan and we'll generate a per-account badge.

Can I use it in a commercial product?

Yes. The badge is free for commercial use. Attribution to sipi.bot is built into the badge design — that's the whole point.

Ready to protect your agents?

The badge shows you care. The firewall behind it actually protects. Deploy both today.

Get started — $99/mo Self-host free