> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dynamic.xyz/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Hyperliquid SDK Integration

> Integrate the Hyperliquid SDK with Dynamic for HyperEVM (chain ID 999) trading using a viem WalletClient from an EVM wallet account.

Hyperliquid is a high-performance decentralized exchange (DEX) built on Arbitrum that offers perpetual futures trading with deep liquidity and low fees. The Hyperliquid SDK provides a comprehensive TypeScript interface for interacting with the exchange programmatically.

This guide shows you how to integrate the Hyperliquid SDK with the Dynamic JavaScript SDK so connected EVM wallets can sign HyperEVM actions.

> [!NOTE]
>
> **HyperEVM vs HyperCore.** This recipe targets **HyperEVM** (Chain ID `999`): switch the wallet to that chain and pass a viem `WalletClient` into Hyperliquid's `ExchangeClient`. For **HyperCore** (EIP-712 signed L1 actions with an embedded wallet, no chain switch), see [HyperCore with embedded wallets](https://docs.dynamic.xyz/docs/recipes/integrations/hyperliquid-hypercore.md).

> [!NOTE]
>
> This recipe uses the Dynamic JavaScript SDK (`@dynamic-labs-sdk/client` + `@dynamic-labs-sdk/evm`). The React tabs below also use `@dynamic-labs-sdk/react-hooks`. See the [Quickstart](https://docs.dynamic.xyz/docs/javascript/reference/quickstart.md) for the base setup (or the [React Quickstart](https://docs.dynamic.xyz/docs/javascript/reference/react-quickstart.md), with `QueryClientProvider` outside `DynamicProvider`).

## Prerequisites

Before integrating Hyperliquid with Dynamic, ensure you have:

* The Dynamic **JavaScript SDK** wired up (`@dynamic-labs-sdk/client` + `@dynamic-labs-sdk/evm`) — for the React tabs, also `@dynamic-labs-sdk/react-hooks` with `QueryClientProvider` outside `<DynamicProvider>` at the root
* **Hyperliquid chain enabled in Dynamic Console** — Enable the Hyperliquid chain (Chain ID: 999) in your [Dynamic Console](https://console.dynamic.xyz) under the EVM chains section
* **Hyperliquid SDK installed** — covered in the installation section below
* For the smart wallet path only: the [ZeroDev extension](https://docs.dynamic.xyz/docs/javascript/reference/zerodev/adding-zerodev-extension.md) (`@dynamic-labs-sdk/zerodev`)

## Installation

Install the Hyperliquid SDK in your project:

> [tab] npm
>
> ```bash theme={"system"}
> npm install @nktkas/hyperliquid
> ```

> [tab] yarn
>
> ```bash theme={"system"}
> yarn add @nktkas/hyperliquid
> ```

> [tab] pnpm
>
> ```bash theme={"system"}
> pnpm add @nktkas/hyperliquid
> ```

> [tab] expo
>
> ```bash theme={"system"}
> npx expo install @nktkas/hyperliquid
> ```

## Creating the Hyperliquid Exchange Client

Hyperliquid's `ExchangeClient` needs a viem `WalletClient` for signing. The JS SDK gives you one via [`createWalletClientForWalletAccount`](https://docs.dynamic.xyz/docs/javascript/reference/evm/getting-viem-wallet-client) (and via [`getSignerForSmartWalletAccount`](https://docs.dynamic.xyz/docs/javascript/reference/zerodev/get-signer-for-smart-wallet-account) for ZeroDev smart wallets). Switch the wallet's active chain to Hyperliquid (`networkId: '999'`) first so signatures target the right chain.

> [!TIP]
>
> If `switchActiveNetwork` throws `NetworkNotAddedError`, call [`addNetwork`](https://docs.dynamic.xyz/docs/javascript/reference/wallets/add-network) first, then switch again. See [Switch Active Network](https://docs.dynamic.xyz/docs/javascript/reference/wallets/switch-active-network.md).

### Standard EVM Wallet Integration

> [tab] JavaScript
>
> ```typescript theme={"system"}
> import * as hl from '@nktkas/hyperliquid';
> import { getWalletAccounts, switchActiveNetwork } from '@dynamic-labs-sdk/client';
> import { isEvmWalletAccount } from '@dynamic-labs-sdk/evm';
> import { createWalletClientForWalletAccount } from '@dynamic-labs-sdk/evm/viem';
>
> async function createHyperliquidExchangeClient() {
>   const walletAccount = getWalletAccounts().find(isEvmWalletAccount);
>   if (!walletAccount) throw new Error('No EVM wallet connected');
>
>   await switchActiveNetwork({ walletAccount, networkId: '999' });
>   const walletClient = await createWalletClientForWalletAccount({ walletAccount });
>
>   return new hl.ExchangeClient({
>     transport: new hl.HttpTransport(),
>     wallet: walletClient,
>   });
> }
>
> // Usage example
> async function placeOrder() {
>   const exchangeClient = await createHyperliquidExchangeClient();
>
>   const orderResult = await exchangeClient.order({
>     orders: [{
>       a: 0,        // asset index (0 for ETH)
>       b: true,     // is_buy (true for buy, false for sell)
>       p: '30000',  // price
>       s: '0.1',    // size
>       r: false,    // reduce_only
>       t: { limit: { tif: 'Gtc' } },
>     }],
>     grouping: 'na',
>   });
>
>   console.log('Order placed:', orderResult);
>   return orderResult;
> }
> ```

> [tab] React
>
> ```tsx theme={"system"}
> import { useCallback, useEffect, useState } from 'react';
> import * as hl from '@nktkas/hyperliquid';
> import { switchActiveNetwork } from '@dynamic-labs-sdk/client';
> import { isEvmWalletAccount } from '@dynamic-labs-sdk/evm';
> import { createWalletClientForWalletAccount } from '@dynamic-labs-sdk/evm/viem';
> import { useGetWalletAccounts } from '@dynamic-labs-sdk/react-hooks';
>
> function useHyperliquidExchangeClient() {
>   const { data: walletAccounts = [] } = useGetWalletAccounts();
>   const walletAccount = walletAccounts.find(isEvmWalletAccount);
>   const [exchangeClient, setExchangeClient] = useState<hl.ExchangeClient | null>(null);
>
>   useEffect(() => {
>     let cancelled = false;
>     if (!walletAccount) {
>       setExchangeClient(null);
>       return;
>     }
>
>     (async () => {
>       await switchActiveNetwork({ walletAccount, networkId: '999' });
>       const walletClient = await createWalletClientForWalletAccount({ walletAccount });
>       if (cancelled) return;
>
>       setExchangeClient(
>         new hl.ExchangeClient({
>           transport: new hl.HttpTransport(),
>           wallet: walletClient,
>         }),
>       );
>     })().catch((err) => console.error('Failed to create Hyperliquid client:', err));
>
>     return () => {
>       cancelled = true;
>     };
>   }, [walletAccount]);
>
>   return exchangeClient;
> }
>
> // Usage example
> function usePlaceOrder() {
>   const exchangeClient = useHyperliquidExchangeClient();
>
>   return useCallback(async () => {
>     if (!exchangeClient) throw new Error('Client not loaded');
>
>     const orderResult = await exchangeClient.order({
>       orders: [{
>         a: 0,        // asset index (0 for ETH)
>         b: true,     // is_buy (true for buy, false for sell)
>         p: '30000',  // price
>         s: '0.1',    // size
>         r: false,    // reduce_only
>         t: { limit: { tif: 'Gtc' } },
>       }],
>       grouping: 'na',
>     });
>
>     console.log('Order placed:', orderResult);
>     return orderResult;
>   }, [exchangeClient]);
> }
> ```

### Smart Wallet Integration

For smart wallets using account abstraction, Hyperliquid still needs to sign with the underlying EOA. Use `getSignerForSmartWalletAccount` from `@dynamic-labs-sdk/zerodev` to get a viem `WalletClient` bound to the EOA:

> [tab] JavaScript
>
> ```typescript theme={"system"}
> import * as hl from '@nktkas/hyperliquid';
> import { getWalletAccounts, switchActiveNetwork } from '@dynamic-labs-sdk/client';
> import { isEvmWalletAccount } from '@dynamic-labs-sdk/evm';
> import { getSignerForSmartWalletAccount } from '@dynamic-labs-sdk/zerodev';
>
> async function createHyperliquidClientFromSmartWallet() {
>   const walletAccount = getWalletAccounts().find(isEvmWalletAccount);
>   if (!walletAccount) throw new Error('No EVM wallet connected');
>
>   await switchActiveNetwork({ walletAccount, networkId: '999' });
>   const eoaSigner = await getSignerForSmartWalletAccount({
>     smartWalletAccount: walletAccount,
>   });
>
>   return new hl.ExchangeClient({
>     transport: new hl.HttpTransport(),
>     wallet: eoaSigner,
>   });
> }
>
> // Usage example with smart wallet
> async function getAccountInfo() {
>   const exchangeClient = await createHyperliquidClientFromSmartWallet();
>   return exchangeClient.getUserState();
> }
> ```

> [tab] React
>
> ```tsx theme={"system"}
> import { useCallback, useEffect, useState } from 'react';
> import * as hl from '@nktkas/hyperliquid';
> import { switchActiveNetwork } from '@dynamic-labs-sdk/client';
> import { isEvmWalletAccount } from '@dynamic-labs-sdk/evm';
> import { useGetWalletAccounts } from '@dynamic-labs-sdk/react-hooks';
> import { getSignerForSmartWalletAccount } from '@dynamic-labs-sdk/zerodev';
>
> function useHyperliquidClientFromSmartWallet() {
>   const { data: walletAccounts = [] } = useGetWalletAccounts();
>   const walletAccount = walletAccounts.find(isEvmWalletAccount);
>   const [exchangeClient, setExchangeClient] = useState<hl.ExchangeClient | null>(null);
>
>   useEffect(() => {
>     let cancelled = false;
>     if (!walletAccount) {
>       setExchangeClient(null);
>       return;
>     }
>
>     (async () => {
>       await switchActiveNetwork({ walletAccount, networkId: '999' });
>       const eoaSigner = await getSignerForSmartWalletAccount({
>         smartWalletAccount: walletAccount,
>       });
>       if (cancelled) return;
>
>       setExchangeClient(
>         new hl.ExchangeClient({
>           transport: new hl.HttpTransport(),
>           wallet: eoaSigner,
>         }),
>       );
>     })().catch((err) => console.error('Failed to create Hyperliquid client:', err));
>
>     return () => {
>       cancelled = true;
>     };
>   }, [walletAccount]);
>
>   return exchangeClient;
> }
>
> // Usage example with smart wallet
> export function useGetAccountInfo() {
>   const exchangeClient = useHyperliquidClientFromSmartWallet();
>
>   return useCallback(async () => {
>     if (!exchangeClient) throw new Error('Client not ready');
>     return exchangeClient.getUserState();
>   }, [exchangeClient]);
> }
> ```

## What You Can Do Next

Once you have created the Hyperliquid exchange client, you can access the full range of trading and account management features:

### Trading Operations

* **Place Orders**: Market orders, limit orders, and stop orders
* **Cancel Orders**: Cancel individual or all orders
* **Modify Orders**: Update existing order parameters

For comprehensive documentation on all available methods and parameters, visit the [Hyperliquid SDK repository](https://github.com/nktkas/hyperliquid).

## Related Documentation

* [HyperCore with embedded wallets](https://docs.dynamic.xyz/docs/recipes/integrations/hyperliquid-hypercore.md)
* [Hyperliquid agent wallets](https://docs.dynamic.xyz/docs/recipes/integrations/hyperliquid-agent-wallets.md)
* [Quickstart (JS SDK)](https://docs.dynamic.xyz/docs/javascript/reference/quickstart.md)
* [Getting a Viem WalletClient](https://docs.dynamic.xyz/docs/javascript/reference/evm/getting-viem-wallet-client.md)
* [Switch Active Network](https://docs.dynamic.xyz/docs/javascript/reference/wallets/switch-active-network.md)
* [getSignerForSmartWalletAccount](https://docs.dynamic.xyz/docs/javascript/reference/zerodev/get-signer-for-smart-wallet-account.md)
* [Hyperliquid SDK Documentation](https://github.com/nktkas/hyperliquid)
* [Hyperliquid API Documentation](https://hyperliquid.gitbook.io/hyperliquid-docs)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.