import { useOpenUrl } from '@coinbase/onchainkit/minikit';

export default function ExternalLinks() {
  const openUrl = useOpenUrl();

  return (
    <div className="external-links">
      <button onClick={() => openUrl('https://base.org')}>
        Visit Base.org
      </button>
      <button onClick={() => openUrl('https://twitter.com/base')}>
        Follow on Twitter
      </button>
      <button onClick={() => openUrl('https://discord.gg/basechain')}>
        Join Discord
      </button>
    </div>
  );
}
Defined in @coinbase/onchainkit
Opens URLs in the appropriate context - either within the Mini App environment or in external browsers. Handles cross-client compatibility automatically.

​
Returns

​
openUrl
(url: string) => void
Function that opens the specified URL. Behavior depends on the URL type and client capabilities.
​
url
string
required
The URL to open. Can be http/https links, deep links, or other URI schemes.
import { useOpenUrl } from '@coinbase/onchainkit/minikit';

export default function ExternalLinks() {
  const openUrl = useOpenUrl();

  return (
    <div className="external-links">
      <button onClick={() => openUrl('https://base.org')}>
        Visit Base.org
      </button>
      <button onClick={() => openUrl('https://twitter.com/base')}>
        Follow on Twitter
      </button>
      <button onClick={() => openUrl('https://discord.gg/basechain')}>
        Join Discord
      </button>
    </div>
  );
}
URLs opened with useOpenUrl may open in different contexts depending on the client. Don’t rely on specific opening behavior for critical functionality.
useOpenUrl automatically handles cross-client compatibility and provides the best user experience for external navigation.