All pages
Powered by GitBook
1 of 1

Loading...

What's VeChain Kit?

VeChain Kit is an all-in-one SDK for building frontend applications on VeChain, supporting wallet integration, developer hooks, pre-built UI components, and more.

It offers:

  • Seamless Wallet Integration: Support for VeWorld, WalletConnect, and social logins.

  • Developer-Friendly Hooks: Easy-to-use React Hooks that let you read and write data on the VeChainThor blockchain.

  • Token Operations: Send and swap tokens, check balances, manage VET domains, and more—all in one place.

  • Pre-Built UI Components: Ready-to-use components (e.g., TransactionModal) to simplify wallet operations and enhance your users’ experience.

The fastest way to build with VeChain Kit is to hand a prompt to your coding agent (Claude Code, Cursor, or any agent). The prompts below tell the agent to read the relevant first so it follows current conventions.

Prefer to wire it yourself? See the .

🚀 Start with AI

Install the VeChain AI Skills once to give every future prompt automatic domain context:

Or in Claude Code: /plugin marketplace add vechain/vechain-ai-skills. Browse all 11 skills live at the VeKit Playground.

VeChain AI Skill
manual installation guide
Cover

VeKit Playground

Cover

Homepage

Cover

NPM Package

Cover

Getting Started

Cover

Customization

Cover

Components

Cover

Troubleshooting

Paste into Claude Code, Cursor, or any AI agent
Before doing anything, read these VeChain AI Skills so you follow current conventions:
- create-vechain-dapp: https://github.com/vechain/vechain-ai-skills/tree/main/skills/create-vechain-dapp
- vechain-kit: https://github.com/vechain/vechain-ai-skills/tree/main/skills/vechain-kit

Now the task:

Scaffold a new VeChain dApp for me using create-vechain-dapp, with:
- VeChain Kit pre-wired (Privy social login: Google + email, plus VeWorld and WalletConnect)
- Chakra UI v3 (with next-themes) and dark mode by default — follow the next-chakra-v3 example in the vechain-kit repo for wiring the kit's `theme` prop via `useChakraContext().token.var(...)` so theme tokens stay reactive
- A landing page that shows the connected user's address, B3TR balance, and a "Send B3TR" button
- A GitHub Pages deploy workflow ready to use

Name the project "my-vechain-dapp". When done, run `yarn dev` and tell me the URL.
Paste into Claude Code, Cursor, or any AI agent
Before doing anything, read this VeChain AI Skill so you follow current conventions:
- vechain-kit: https://github.com/vechain/vechain-ai-skills/tree/main/skills/vechain-kit

Now the task:

I already have a Next.js app and I want to add VeChain Kit to it.

1. Install @vechain/vechain-kit and any required peer deps.
2. Find my root layout (app/layout.tsx for App Router or pages/_app.tsx for Pages Router) and wrap it with VeChainKitProvider.
3. Enable Privy social login (Google + email), VeWorld and WalletConnect.
4. Read Privy keys from NEXT_PUBLIC_PRIVY_* and the WalletConnect projectId from NEXT_PUBLIC_WC_PROJECT_ID.
5. Add a <WalletButton /> to my existing header.
6. Don't change my existing Chakra theme.

If you hit peer-dependency conflicts, stop and tell me before applying any fix.
npx skills add vechain/vechain-ai-skills