Integrate as a widget

The Hobba widget is a drop-in, framework-agnostic UI you can embed in any website to let your users deposit collateral, open borrow positions, and view live market data - all powered by Hobba’s on-chain lending protocol on Solana.

It ships as a single hosted script. You don’t bundle anything, install any npm package, or manage Hobba’s UI or dependencies - you point a <script> tag at the hosted file and call a mount function.

<script src="https://app.hobba.io/hobba.iife.js"></script>
<div id="hobba"></div>
<script>
  window.HobbaQueue = window.HobbaQueue || [];
  HobbaQueue.push(function () {
    window.Hobba.mountDepositBorrow("#hobba", { collateral: "cbBTC", theme: "dark" });
  });
</script>

What you get

The script exposes a single global, window.Hobba, with two mount functions:

Widget	Mount function	Wallet required?	What it does
Deposit / Borrow	mountDepositBorrow	Yes (to transact)	Deposit cbBTC or SOL as collateral and borrow against it
Market data	mountMarketData	No	Read-only rates, prices, and market stats

Both render into a Shadow DOM, so the widget’s styles are fully isolated from your page - there’s no CSS bleed in either direction.

Pick your path

• Prerequisites - start here: a wallet must be allowlisted once before it can deposit or borrow.
• Quick start - the copy-paste script-tag setup. Best for plain HTML pages and most websites.
• Backend & CORS - how the widget talks to Hobba’s API, the origin allowlist, and self-hosting the API base URL.

Want Hobba under your own UI instead of an embedded one? Use the Hobba SDK - the same on-chain logic as an npm package.