diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/Home.tsx
index c36325c..0b159ad 100644
--- a/frontend/src/pages/Home.tsx
+++ b/frontend/src/pages/Home.tsx
@@ -22,7 +22,13 @@ const Home: React.FC = () => {
 
     /* methods */
     const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        if (e.key === 'Enter' && url.trim() !== '') {
+        if (e.key === 'Enter') {
+            handleSubmit();
+        }
+    };
+
+    const handleSubmit = () => {
+        if (url.trim() !== '') {
             dispatch(shortenUrl(url));
         }
     };
@@ -35,52 +41,75 @@ const Home: React.FC = () => {
         }
     };
 
+    const handleClear = () => {
+        dispatch(clearShortUrl())
+    };
+
     return (
-        <div className="min-h-screen flex items-center justify-center bg-purple-100">
+        <div className="min-h-screen bg-purple-100 px-4 py-10 flex flex-col items-center">
+            {/* Top Section (Static Position) */}
             <div className="text-center space-y-6">
                 <h1 className="text-5xl text-orange-500 font-pacifico">minxa.lol</h1>
 
-                <input
-                    type="text"
-                    placeholder="https://example.com/my-long-url"
-                    value={url}
-                    onChange={(e) => setUrl(e.target.value)}
-                    onKeyDown={handleKeyDown}
-                    className="w-80 p-3 rounded-md text-lg border border-gray-300 shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-400"
-                />
+                <div className="flex items-center justify-center space-x-2">
+                    <input
+                        type="text"
+                        placeholder="https://example.com/my-long-url"
+                        value={url}
+                        onChange={(e) => setUrl(e.target.value)}
+                        onKeyDown={handleKeyDown}
+                        className="w-80 p-3 rounded-md text-lg border border-gray-300 shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-400"
+                    />
+                    <button
+                        onClick={handleSubmit}
+                        className="w-12 h-12 bg-orange-500 text-white text-xl font-bold rounded-md hover:bg-orange-600 transition"
+                    >
+                        ↵
+                    </button>
+                </div>
 
-                {/* Loading State */}
                 {status === 'loading' && (
                     <p className="text-gray-600 text-sm">Shortening your URL...</p>
                 )}
 
-                {/* Error Message */}
                 {status === 'failed' && (
                     <p className="text-red-600 text-sm">{error}</p>
                 )}
+            </div>
 
-                {/* Short URL Display */}
-                {status === 'succeeded' && shortUrl && (
-                    <div className="space-y-2">
-                        <p className="text-green-700 font-medium text-lg">
-                            Your short URL:
-                            <a
-                                href={shortUrl}
-                                target="_blank"
-                                rel="noopener noreferrer"
-                                className="underline ml-2"
-                            >
-                                {shortUrl}
-                            </a>
-                        </p>
+            {/* Spacer to ensure result doesn't push up the input */}
+            <div className="h-10" />
+
+            {/* Result Section (Appears Below) */}
+            {status === 'succeeded' && shortUrl && (
+                <div className="w-full max-w-md border-t border-gray-300 pt-6 text-center">
+                    <p className="text-green-700 font-medium text-lg">
+                        Your short URL:
+                        <a
+                            href={shortUrl}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="underline ml-2"
+                        >
+                            {shortUrl}
+                        </a>
+                    </p>
+                    <div className="flex justify-center space-x-2 mt-4">
                         <button
                             onClick={handleCopy}
-                            className="bg-orange-500 text-white px-4 py-2 rounded hover:bg-orange-600 transition">
-                                Copy to Clipboard
+                            className="bg-orange-500 text-white px-4 py-2 rounded hover:bg-orange-600 transition"
+                        >
+                            Copy to Clipboard
+                        </button>
+                        <button
+                            onClick={handleClear}
+                            className="bg-gray-300 text-gray-800 px-4 py-2 rounded hover:bg-gray-400 transition"
+                        >
+                            Clear
                         </button>
                     </div>
-                )}
-            </div>
+                </div>
+            )}
         </div>
     );
 };