diff --git a/app/components/TradeForm.tsx b/app/components/TradeForm.tsx
new file mode 100644
index 0000000..0b6e7c8
--- /dev/null
+++ b/app/components/TradeForm.tsx
@@ -0,0 +1,47 @@
+import React from 'react'
+import { Input } from '@/components/ui/input'
+import { Button } from '@/components/ui/button'
+
+interface TradeFormProps {
+  type: 'buy' | 'sell'
+  price: string
+  amount: string
+  onPriceChange: (value: string) => void
+  onAmountChange: (value: string) => void
+  baseAsset?: string
+  quoteAsset?: string
+}
+
+export function TradeForm({
+  type,
+  price,
+  amount,
+  onPriceChange,
+  onAmountChange,
+  baseAsset = 'BTC',
+  quoteAsset = 'USDT'
+}: TradeFormProps) {
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault()
+    console.log(`${type} order:`, { price, amount })
+  }
+
+  return (
+    <form onSubmit={handleSubmit} className="bg-card rounded-lg p-4 border">
+      <h2 className="text-lg font-bold mb-4">{type === 'buy' ? `Buy ${baseAsset}` : `Sell ${baseAsset}`}</h2>
+      <div className="space-y-4">
+        <div>
+          <label className="text-sm text-muted-foreground">Price ({quoteAsset})</label>
+          <Input type="number" value={price} onChange={(e) => onPriceChange(e.target.value)} className="mt-1" />
+        </div>
+        <div>
+          <label className="text-sm text-muted-foreground">Amount ({baseAsset})</label>
+          <Input type="number" value={amount} onChange={(e) => onAmountChange(e.target.value)} className="mt-1" />
+        </div>
+        <Button type="submit" className="w-full" variant={type === 'buy' ? 'default' : 'destructive'}>
+          {type === 'buy' ? 'Buy' : 'Sell'} {baseAsset}
+        </Button>
+      </div>
+    </form>
+  )
+}
diff --git a/app/en/trade/BTCUSDT/page.tsx b/app/en/trade/BTCUSDT/page.tsx
index a5c2f4b..c63a555 100644
--- a/app/en/trade/BTCUSDT/page.tsx
+++ b/app/en/trade/BTCUSDT/page.tsx
@@ -4,12 +4,12 @@ import React, { useState } from 'react'
 import dynamic from 'next/dynamic'
 import { useRouter } from 'next/navigation'
 import { useCandlestickData } from '@/hooks/queries/useCandlestickData'
-import { Input } from '@/components/ui/input'
 import { OrderBook } from '@/components/OrderBook'
 import { MarketList } from '@/components/MarketList'
 import { CoinInfo } from '@/components/CoinInfo'
 import { Button } from '@/components/ui/button'
 import { cn } from '@/lib/utils'
+import { TradeForm } from '@/app/components/TradeForm'
 
 const CandlestickChart = dynamic(() => import('@/components/charts/CandlestickChart'), { ssr: false })
 
@@ -27,10 +27,14 @@ export default function TradePage() {
   const { data, isLoading, isWebSocketConnected } = useCandlestickData('BTCUSDT', interval)
   const [buyPrice, setBuyPrice] = useState('')
   const [sellPrice, setSellPrice] = useState('')
+  const [buyAmount, setBuyAmount] = useState('')
+  const [sellAmount, setSellAmount] = useState('')
 
-  const handlePriceSelect = (price: number) => {
+  const handlePriceSelect = (price: number, amount: number) => {
     setBuyPrice(price.toString())
     setSellPrice(price.toString())
+    setBuyAmount(amount.toString())
+    setSellAmount(amount.toString())
   }
 
   const handleMarketSelect = (symbol: string) => {
@@ -95,42 +99,24 @@ export default function TradePage() {
 
           {/* 거래 영역 - 태블릿/데스크톱 */}
           <div className="hidden md:grid grid-cols-2 gap-4 md:order-3">
-            <div className="bg-card rounded-lg p-4 border">
-              <h2 className="text-lg font-bold mb-4">Buy BTC</h2>
-              <div className="space-y-4">
-                <div>
-                  <label className="text-sm text-muted-foreground">Price (USDT)</label>
-                  <Input
-                    type="number"
-                    value={buyPrice}
-                    onChange={(e) => setBuyPrice(e.target.value)}
-                    className="mt-1"
-                  />
-                </div>
-                <div>
-                  <label className="text-sm text-muted-foreground">Amount (BTC)</label>
-                  <Input type="number" className="mt-1" />
-                </div>
-              </div>
-            </div>
-            <div className="bg-card rounded-lg p-4 border">
-              <h2 className="text-lg font-bold mb-4">Sell BTC</h2>
-              <div className="space-y-4">
-                <div>
-                  <label className="text-sm text-muted-foreground">Price (USDT)</label>
-                  <Input
-                    type="number"
-                    value={sellPrice}
-                    onChange={(e) => setSellPrice(e.target.value)}
-                    className="mt-1"
-                  />
-                </div>
-                <div>
-                  <label className="text-sm text-muted-foreground">Amount (BTC)</label>
-                  <Input type="number" className="mt-1" />
-                </div>
-              </div>
-            </div>
+            <TradeForm
+              type="buy"
+              price={buyPrice}
+              amount={buyAmount}
+              onPriceChange={setBuyPrice}
+              onAmountChange={setBuyAmount}
+              baseAsset="BTC"
+              quoteAsset="USDT"
+            />
+            <TradeForm
+              type="sell"
+              price={sellPrice}
+              amount={sellAmount}
+              onPriceChange={setSellPrice}
+              onAmountChange={setSellAmount}
+              baseAsset="BTC"
+              quoteAsset="USDT"
+            />
           </div>
         </main>
 
@@ -152,37 +138,24 @@ export default function TradePage() {
 
         {/* 거래 영역 - 모바일 */}
         <div className="md:hidden grid grid-cols-1 gap-4 order-5">
-          <div className="bg-card rounded-lg p-4 border">
-            <h2 className="text-lg font-bold mb-4">Buy BTC</h2>
-            <div className="space-y-4">
-              <div>
-                <label className="text-sm text-muted-foreground">Price (USDT)</label>
-                <Input type="number" value={buyPrice} onChange={(e) => setBuyPrice(e.target.value)} className="mt-1" />
-              </div>
-              <div>
-                <label className="text-sm text-muted-foreground">Amount (BTC)</label>
-                <Input type="number" className="mt-1" />
-              </div>
-            </div>
-          </div>
-          <div className="bg-card rounded-lg p-4 border">
-            <h2 className="text-lg font-bold mb-4">Sell BTC</h2>
-            <div className="space-y-4">
-              <div>
-                <label className="text-sm text-muted-foreground">Price (USDT)</label>
-                <Input
-                  type="number"
-                  value={sellPrice}
-                  onChange={(e) => setSellPrice(e.target.value)}
-                  className="mt-1"
-                />
-              </div>
-              <div>
-                <label className="text-sm text-muted-foreground">Amount (BTC)</label>
-                <Input type="number" className="mt-1" />
-              </div>
-            </div>
-          </div>
+          <TradeForm
+            type="buy"
+            price={buyPrice}
+            amount={buyAmount}
+            onPriceChange={setBuyPrice}
+            onAmountChange={setBuyAmount}
+            baseAsset="BTC"
+            quoteAsset="USDT"
+          />
+          <TradeForm
+            type="sell"
+            price={sellPrice}
+            amount={sellAmount}
+            onPriceChange={setSellPrice}
+            onAmountChange={setSellAmount}
+            baseAsset="BTC"
+            quoteAsset="USDT"
+          />
         </div>
       </div>
     </div>
diff --git a/components/OrderBook.tsx b/components/OrderBook.tsx
index 8b240ec..8f1998e 100644
--- a/components/OrderBook.tsx
+++ b/components/OrderBook.tsx
@@ -5,7 +5,7 @@ import { cn } from '@/lib/utils'
 
 interface OrderBookProps {
   symbol: string
-  onPriceSelect: (price: number) => void
+  onPriceSelect: (price: number, amount: number) => void
 }
 
 export const OrderBook = ({ symbol, onPriceSelect }: OrderBookProps) => {
@@ -68,7 +68,7 @@ export const OrderBook = ({ symbol, onPriceSelect }: OrderBookProps) => {
                 <tr
                   key={i}
                   className="relative hover:bg-accent/50 cursor-pointer"
-                  onClick={() => onPriceSelect(ask.price)}
+                  onClick={() => onPriceSelect(ask.price, ask.quantity)}
                 >
                   <td className="p-1 text-red-500 relative z-10 w-[30%]">{formatPrice(ask.price)}</td>
                   <td className="p-1 text-right relative z-10 w-[40%]">{formatAmount(ask.quantity)}</td>
@@ -100,7 +100,7 @@ export const OrderBook = ({ symbol, onPriceSelect }: OrderBookProps) => {
                 <tr
                   key={i}
                   className="relative hover:bg-accent/50 cursor-pointer"
-                  onClick={() => onPriceSelect(bid.price)}
+                  onClick={() => onPriceSelect(bid.price, bid.quantity)}
                 >
                   <td className="p-1 text-green-500 relative z-10 w-[30%]">{formatPrice(bid.price)}</td>
                   <td className="p-1 text-right relative z-10 w-[40%]">{formatAmount(bid.quantity)}</td>