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.