Web3 Widgets ๐Ÿ†•

Web3 Widgets are a new form of DexKit components that you can embed into virtually any platform or website, regardless of the programming language used.

Web3 widgets allow you to add Web3 functionalityโ€”such as swaps, decentralized exchanges, token drops, NFT mints, and moreโ€”directly into Web2 or Web3 environments without complex integrations.

This system is perfect for projects in production or for ideas still in the planning phase. With Web3 Widgets, you can transform your platform into a revenue-generating Web3 hub in minutes.

Key Features

  • Universal Embedding โ€“ Works with any platform or website, coded in any language.

  • Wide Range of Components โ€“ Supports swap widgets, DEX integrations, NFT minting, token drops, and more.

  • Zero Friction โ€“ No need to migrate or rebuild your existing platform.

  • Revenue Generation โ€“ Earn fees from swaps or use widgets for token sales.

  • Customizable Look & Feel โ€“ Change colors, themes, and layouts to match your branding.

  • Multi-Network Support โ€“ Choose from Ethereum, Optimism, BNB Chain, Polygon, Base, Arbitrum, Avalanche, and more.

How It Works

Web3 Widgets use a simple iframe embed to display and run fully functional Web3 components inside your website or application. Once embedded, users can interact with blockchain features directly, without leaving your platform.

Getting Started

1. Access the Builder

Go to dexabuilder.dexkit.com. DexKitโ€™s Builder is a no-code/low-code platform for creating on-chain apps and widgets. You do not need to create an entire app to use the widget functionality.

2. Connect Your Wallet

  • Click Connect Wallet.

  • Select your preferred wallet (e.g., MetaMask).

  • Authorize the connection.

3. Manage Widgets

  • From the top navigation bar, go to Manage Widgets.

  • Sign the authentication request in your wallet.

  • You will be redirected to your Widget Dashboard.

4. Create a New Widget

  • Click New Widget.

  • Enter a private name (only visible to you).

  • Click Create to open the widget settings.

5. Configure General Settings

  • Change private name if needed.

  • Set the default currency.

  • Select your widgetโ€™s language.

6. Credits & Branding

By default, widgets display โ€œPowered by DexKitโ€ in the footer.

  • Free Plan โ€“ 100,000 free requests/month.

  • Paid Plan โ€“ $50/month to remove branding and fully customize the footer.

7. Layout & Theme

  • Change primary, secondary, background, paper, and text colors.

  • Choose from hundreds of fonts or use a default theme.

8. Add Components

  • Click Add Section.

  • Choose the desired Web3 component (e.g., Swap).

  • Select your layout: classic, modern, minimal, compact, mobile, etc.

  • Configure:

    • Default Network (Ethereum, Polygon, BNB, etc.)

    • Input Token (token the user has)

    • Output Token (token the user wants)

9. Set Swap Fees

  • Go to Swap Fees.

  • Add your wallet address to receive fees.

  • Set a percentage (e.g., 0.1%). Lower fees generally result in more transactions.

10. Configure Data Sources

  • Import NFT collections (optional).

  • Select supported networks for the widget.

  • Import tokens via:

    • Search API

    • Contract address (auto-filled with logo and details)

Highlight favorite tokens so they appear prominently in the widget.

11. Embed the Widget

  • Click Embed.

  • Copy the generated iframe code.

  • Paste it into your website or appโ€™s HTML where you want the widget to appear.

Example:

<iframe src="https://dexabuilder.dexkit.com/widget?id=12345" width="400" height="600"></iframe>

Example Use Cases

  • Add a DEX swap to your Web2 e-commerce site.

  • Integrate NFT minting into a gameโ€™s landing page.

  • Enable token purchases directly from your community portal.

  • Run promotional drops without moving your main site to Web3.

Best Practices

  • Keep your fee percentage low to encourage more trades.

  • Ensure imported tokens and NFTs are verified and correctly configured.

  • Test your widget in multiple screen sizes before going live.

  • Monitor usage from the Widget Dashboard to adjust performance and offerings.

This Web3 Widget solution allows you to upgrade your platform into a Web3-ready service in minutes, without writing complex blockchain code. Whether you want to monetize via swap fees, sell your own tokens, or provide a better experience for your users, DexKit Web3 Widgets give you the flexibility and power to make it happen.

Last updated