Orderlume

An animated trading workspace built around a candlestick chart and a long/short order ticket. The same simulated market drives a USD yield vault, a weekly competition and an activity ledger for positions, orders and fees.

• Best forDevelopers building derivatives, trading and DeFi interfaces with a complete order workflow.

• Trade

  Explore 64 animated candles, six timeframes, four mini markets, MA(20), volume and a keyboard-accessible OHLC crosshair. A long/short ticket calculates exposure, stop loss, take profit, liquidation and fees before confirmation. Confirming adds entry and trigger lines to the chart.

• Vault

  Inspect simulated APY, deposited value, your share, strategy allocation and the next distribution timer. A deposit or withdrawal updates the local wallet after validation and confirmation.

• Compete

  Join the simulated weekly sprint, see the prize split and search three leagues with your own row pinned. Your rank responds to closed trades against static opponents.

• Activity

  Follow equity, unrealized and realized PnL, fees and the daily limit. Inspect positions, active triggers and history, adjust TP/SL, close positions and export filtered data as CSV.

• Candle chart and market controls

  Switch markets and timeframes, move a pointer or keyboard crosshair across OHLC values, toggle MA(20) and volume, choose linear or log scale, enter fullscreen and export a PNG.

• Leveraged order ticket

  Choose buy or sell, set an amount and leverage from 1× to 100×, and review execution, spread, exposure, liquidation and fees. Set stop loss and take profit using ROE presets or custom values.

• Position overlays and reconciled PnL

  Entry, take-profit and stop-loss lines appear after confirming. The chart, activity table and wallet share the same position state and realized results account for demo fees.

• Vault and weekly competition

  Explore vault balances, strategy allocation and deposits or withdrawals, then see your own simulated rank update after a closed trade.

• Ledger and referrals

  Filter and export positions, orders, history and fees. The referrals drawer holds a copyable code, rebate tiers and a demo claim action.

• Motion and mobile layout

  Candles, charts and figures animate as their views appear. Mobile uses bottom tabs and a slide-up order ticket, with reduced-motion support throughout.

Responsive layouts, keyboard-accessible navigation and reduced-motion support.

A deterministic local simulation with invented tokens and demo funds. The leaderboard opponents are static. The ticket supports market orders with attached TP/SL triggers and full closes. The project has no live exchange, price feed, wallet, blockchain, order routing or real settlement. It is a frontend template for demonstration.

• IncludedFictional demonstration data and local interactions, ready to edit. The included README identifies the data files and model.
• Not includedBackend, database, authentication, payments or AI services. Features that look connected are simulated; connect your own services when you adapt the code.

• Complete Next.js project
• 4 animated views
• Source files and project assets
• README with setup and customization
• LICENSE.md

Stack and requirements

• StackNext.js 16, React 19, TypeScript, Tailwind CSS 4, Framer Motion 12, Lucide icons
• FontsPlus Jakarta Sans
• RequiresNode.js 20.9 or later, npm, and working knowledge of React and Next.js

Run it locally

Extract the ZIP, open a terminal in the project folder, then run:

npm install
npm run dev

Open localhost:3000. The README covers the data, colors, fonts and animations.

• Price$9 USD, one-time payment. No subscription or renewal.
• TaxesApplicable VAT and sales tax are included in the price. The total is shown before you pay.
• LicenseUnlimited personal and client projects. No resale or redistribution of the source. Read the license
• DeliveryAfter payment, Polar emails your receipt and a download link for the ZIP.
• RefundsIf the files don’t install or run as described and can’t be fixed within 7 days, you get a full refund. Refund policy
• Supporthello@buildindex.dev for the template as delivered.

Secure checkout by Polar. More answers in the questions.