KyberSwap Docs
Search…
⌃K

Integrating The KyberSwap Widget

The Best Rates With Minimal Code

Installing the Swap Widget

To get started, install the widgets library using npm or Yarn.

npm:

npm i @kyberswap/widgets

yarn:

yarn add @kyberswap/widgets

Adding the Swap widget to your app

Embed the React component in your application with this piece of code:
import { Widget } from "@kyberswap/widgets";
<Widget
theme={theme}
tokenList={[]}
provider={ethersProvider}
defaultTokenOut={defaultTokenOut[chainId]}
/>
That's it! You should now see a fully functional swap widget on your site. You can easily customize the widget according to your application colors.