Skip to content
Developers/
/
/
Wormhole Connect Widget

Wormhole Connect Widget

Wormhole Connect is a drop-in React widget that gives your dApp a complete bridging UI: chain and token selection, wallet connections, quoting, and transfer tracking. On the XRPL EVM, Connect is available on Mainnet (Testnet is not currently supported).

Install

npm install @wormhole-foundation/wormhole-connect

Add the Widget

Configure Connect with the chains you want to expose. The XRPL EVM's chain name is XRPLEVM:

import WormholeConnect, {
  type config,
  WormholeConnectTheme,
} from "@wormhole-foundation/wormhole-connect";

function App() {
  const config: config.WormholeConnectConfig = {
    network: "Mainnet",
    chains: ["XRPLEVM", "Ethereum", "Solana"],
    ui: {
      title: "XRPL EVM Bridge",
    },
  };

  const theme: WormholeConnectTheme = {
    mode: "dark",
    primary: "#32dbc7",
  };

  return <WormholeConnect config={config} theme={theme} />;
}

export default App;
Verify chain support in your installed version

Chain availability in Connect follows the Wormhole SDK chain names and the routes enabled for each network. If the widget rejects the XRPLEVM chain string, upgrade @wormhole-foundation/wormhole-connect to the latest release and check the Connect supported networks table.

Customize

  • Custom RPCs: Point Connect at your own XRPL EVM RPC (for example https://rpc.xrplevm.org) via the data configuration.
  • Theming: Adjust colors, fonts, and layout with the theme configuration.
  • Routes and tokens: Restrict which tokens and routes appear, including NTT tokens you have deployed.

Next Steps