Skip to main content
The Perps dashboard is a full desktop trading terminal you host on your own domain. Its layout follows the Hyperliquid trading screen: a market bar, a price chart, an order form, and positions and open orders below. It is built on the Perps API, and users sign every action in their own wallet. For a compact module that fits inside an existing screen, see the Perps widget. Both come from the same source repository.
Perps trading carries jurisdictional restrictions, and the Perps API blocks requests from banned regions. Read the perpetuals disclaimer and Geo-blocking before you deploy.

What users can do

  • Search for and switch between markets, with last price, volume, open interest and funding in the market bar.
  • Read a live price chart for the selected market.
  • Go long or short with market or limit orders, set leverage and choose cross or isolated margin.
  • Track positions (entry price, mark price, margin, leverage) and open orders in tabs, and close a position or cancel an order from there.
  • Deposit to and withdraw from their Hyperliquid account from the header.

Prerequisites

The prerequisites match the Perps widget: a Yield.xyz API key with the Perps API enabled, a Moralis API key, an optional Reown project ID, and Node.js 24 with pnpm 10.

Run it locally

1

Clone and install

2

Set environment variables

The dashboard reads its own .env:
packages/dashboard/.env
VITE_PERPS_BASE_URL, VITE_PERPS_API_KEY and VITE_MORALIS_API_KEY are required. VITE_REOWN_PROJECT_ID is optional.
3

Start the dev server

Open http://localhost:3001.
Every VITE_ variable is bundled into the browser build, so treat these keys as public. Restrict them where the provider allows it, and see the security notice.

Build and deploy

The build output is written to packages/dashboard/dist. Deploy it to any static host that serves single-page apps, with every path routed to index.html as in the repository’s vercel.json. Set the environment variables in your host’s build settings.

Embed it

The dashboard is designed for full-page use on desktop. Host it on its own route or subdomain, or embed it at full width:

How it works

The dashboard makes the same Perps API calls as the widget: providers, markets and candles for discovery; balances, positions and orders for the account; POST /v1/actions to build each trade; and POST /v1/transactions/{transactionId}/submit to submit the signature. See How it works on the Perps widget page, and the Perps API guide for the full flow.

Customize it

The dashboard lives in packages/dashboard, with its screens in src/components/modules/trade and the header, positions and orders in src/components/molecules. API clients, state and shared components are in packages/common, shared with the widget. Styling uses Tailwind CSS v4.

Troubleshooting

The Perps widget troubleshooting entries also apply to the dashboard: missing environment variables, wallet connection, the pnpm version and single-page app routing.

License

The Perps dashboard is published under the Business Source License 1.1 (BSL-1.1), which converts to MIT on 2030-01-20. Read the LICENSE file in the repository before you deploy it.

Next steps

Perps widget

The compact module from the same repository.

Perps API guide

Build your own Perps interface on the same API.