diff --git a/app/(app)/pastel/page.tsx b/app/(app)/pastel/page.tsx
index 4569e45..529a1a2 100644
--- a/app/(app)/pastel/page.tsx
+++ b/app/(app)/pastel/page.tsx
@@ -61,7 +61,7 @@ function PlaygroundContent() {
     <div className="min-h-screen py-12">
       <div className="max-w-7xl mx-auto px-8 space-y-8">
         <div>
-          <h1 className="text-4xl font-bold mb-2">Color Playground</h1>
+          <h1 className="text-4xl font-bold mb-2">Pastel</h1>
           <p className="text-muted-foreground">
             Interactive color manipulation and analysis tool
           </p>
diff --git a/components/Hero.tsx b/components/Hero.tsx
index a318083..76527cc 100644
--- a/components/Hero.tsx
+++ b/components/Hero.tsx
@@ -24,7 +24,7 @@ export default function Hero() {
           animate={{ opacity: 1, y: 0 }}
           transition={{ duration: 0.8 }}
         >
-          <Logo size={160} />
+          <Logo size={130} />
         </motion.div>
 
         {/* Main heading */}
diff --git a/components/pastel/layout/Footer.tsx b/components/pastel/layout/Footer.tsx
deleted file mode 100644
index 81e081a..0000000
--- a/components/pastel/layout/Footer.tsx
+++ /dev/null
@@ -1,203 +0,0 @@
-'use client';
-
-import Link from 'next/link';
-import { Github, Heart, ExternalLink } from 'lucide-react';
-
-export function Footer() {
-  const currentYear = new Date().getFullYear();
-
-  return (
-    <footer className="border-t bg-card/50 backdrop-blur-sm">
-      <div className="max-w-7xl mx-auto px-8 py-12">
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-8">
-          {/* About */}
-          <div className="space-y-3">
-            <h3 className="font-semibold text-lg">Pastel UI</h3>
-            <p className="text-sm text-muted-foreground">
-              A modern, interactive web application for color manipulation, palette generation,
-              and accessibility analysis
-            </p>
-          </div>
-
-          {/* Resources */}
-          <div className="space-y-3">
-            <h3 className="font-semibold">Resources</h3>
-            <ul className="space-y-2 text-sm">
-              <li>
-                <Link href="/pastel" className="text-muted-foreground hover:text-foreground transition-colors">
-                  Color Playground
-                </Link>
-              </li>
-              <li>
-                <Link href="/pastel/harmony" className="text-muted-foreground hover:text-foreground transition-colors">
-                  Palette Generator
-                </Link>
-              </li>
-              <li>
-                <Link href="/pastel/contrast" className="text-muted-foreground hover:text-foreground transition-colors">
-                  Accessibility Tools
-                </Link>
-              </li>
-              <li>
-                <Link href="/pastel/batch" className="text-muted-foreground hover:text-foreground transition-colors">
-                  Batch Operations
-                </Link>
-              </li>
-            </ul>
-          </div>
-
-          {/* Documentation */}
-          <div className="space-y-3">
-            <h3 className="font-semibold">Documentation</h3>
-            <ul className="space-y-2 text-sm">
-              <li>
-                <a
-                  href="https://github.com/valknarness/pastel-ui#readme"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors inline-flex items-center gap-1"
-                >
-                  Getting Started
-                  <ExternalLink className="h-3 w-3" />
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/valknarness/pastel-api#readme"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors inline-flex items-center gap-1"
-                >
-                  API Documentation
-                  <ExternalLink className="h-3 w-3" />
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/sharkdp/pastel"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors inline-flex items-center gap-1"
-                >
-                  Pastel CLI
-                  <ExternalLink className="h-3 w-3" />
-                </a>
-              </li>
-            </ul>
-          </div>
-
-          {/* Community */}
-          <div className="space-y-3">
-            <h3 className="font-semibold">Community</h3>
-            <ul className="space-y-2 text-sm">
-              <li>
-                <a
-                  href="https://github.com/valknarness/pastel-ui"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors inline-flex items-center gap-2"
-                >
-                  <Github className="h-4 w-4" />
-                  Pastel UI
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/valknarness/pastel-api"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors inline-flex items-center gap-2"
-                >
-                  <Github className="h-4 w-4" />
-                  Pastel API
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/valknarness/pastel-ui/issues"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors"
-                >
-                  Report an Issue
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/valknarness/pastel-ui/discussions"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors"
-                >
-                  Discussions
-                </a>
-              </li>
-            </ul>
-          </div>
-        </div>
-
-        {/* Bottom Bar */}
-        <div className="mt-12 pt-8 border-t">
-          <div className="flex flex-col md:flex-row justify-between items-center gap-4">
-            <div className="text-sm text-muted-foreground">
-              <p className="inline-flex items-center gap-1">
-                © {currentYear} Pastel UI. Built with
-                <Heart className="h-4 w-4 text-red-500 fill-red-500" />
-                using
-                <a
-                  href="https://nextjs.org"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="hover:text-foreground transition-colors underline"
-                >
-                  Next.js
-                </a>
-                and
-                <a
-                  href="https://tailwindcss.com"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="hover:text-foreground transition-colors underline"
-                >
-                  Tailwind CSS
-                </a>
-              </p>
-            </div>
-
-            <div className="flex items-center gap-6 text-sm text-muted-foreground">
-              <p>
-                Based on{' '}
-                <a
-                  href="https://github.com/sharkdp/pastel"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="hover:text-foreground transition-colors underline"
-                >
-                  Pastel
-                </a>
-                {' '}by{' '}
-                <a
-                  href="https://github.com/sharkdp"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="hover:text-foreground transition-colors underline"
-                >
-                  David Peter
-                </a>
-              </p>
-              <span>•</span>
-              <a
-                href="https://github.com/valknarness/pastel-ui/blob/main/LICENSE"
-                target="_blank"
-                rel="noopener noreferrer"
-                className="hover:text-foreground transition-colors"
-              >
-                MIT License
-              </a>
-            </div>
-          </div>
-        </div>
-      </div>
-    </footer>
-  );
-}
diff --git a/components/units/converter/MainConverter.tsx b/components/units/converter/MainConverter.tsx
index 49f0570..50b0f0b 100644
--- a/components/units/converter/MainConverter.tsx
+++ b/components/units/converter/MainConverter.tsx
@@ -148,8 +148,10 @@ export default function MainConverter() {
           <CardTitle>Convert {formatMeasureName(selectedMeasure)}</CardTitle>
         </CardHeader>
         <CardContent className="space-y-6 pt-0">
-          <div className="flex gap-2 items-end">
-            <div className="flex-1">
+          {/* Input row, stacks vertically on mobile, horizontal on desktop */}
+          <div className="flex flex-col gap-4 md:flex-row md:items-end md:gap-2">
+            {/* Value Input */}
+            <div className="flex-1 w-full">
               <label className="text-sm font-medium mb-2 block">Value</label>
               <Input
                 type="text"
@@ -157,10 +159,11 @@ export default function MainConverter() {
                 value={inputValue}
                 onChange={(e) => setInputValue(e.target.value)}
                 placeholder="Enter value"
-                className="text-lg"
+                className={cn("text-lg", "w-full", "max-w-full")}
               />
             </div>
-            <div className="w-40">
+            {/* From Unit Select */}
+            <div className="w-full md:w-40">
               <label className="text-sm font-medium mb-2 block">From</label>
               <Select
                 value={selectedUnit}
@@ -173,16 +176,18 @@ export default function MainConverter() {
                 ))}
               </Select>
             </div>
+            {/* Swap Button */}
             <Button
               variant="outline"
               size="icon"
               onClick={handleSwapUnits}
-              className="flex-shrink-0"
+              className="flex-shrink-0 w-full md:w-40" // Make button full width on mobile too
               title="Swap units"
             >
               <ArrowLeftRight className="h-4 w-4" />
             </Button>
-            <div className="w-40">
+            {/* To Unit Select */}
+            <div className="w-full md:w-40">
               <label className="text-sm font-medium mb-2 block">To</label>
               <Select
                 value={targetUnit}
diff --git a/components/units/ui/Footer.tsx b/components/units/ui/Footer.tsx
deleted file mode 100644
index 1dd1e99..0000000
--- a/components/units/ui/Footer.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-import { Heart, Github, Code2 } from 'lucide-react';
-import Link from 'next/link';
-
-export default function Footer() {
-  const currentYear = new Date().getFullYear();
-
-  return (
-    <footer className="border-t mt-16 bg-background">
-      <div className="w-full max-w-7xl mx-auto px-4 py-8">
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-          {/* About */}
-          <div>
-            <h3 className="font-semibold mb-3">Units UI</h3>
-            <p className="text-sm text-muted-foreground">
-              A spectacular unit conversion app supporting 23 measurement categories
-              with 187 units. Built with Next.js 16, TypeScript, and Tailwind CSS 4
-            </p>
-          </div>
-
-          {/* Features */}
-          <div>
-            <h3 className="font-semibold mb-3">Features</h3>
-            <ul className="space-y-2 text-sm text-muted-foreground">
-              <li>• Real-time bidirectional conversion</li>
-              <li>• Fuzzy search across all units</li>
-              <li>• Dark mode support</li>
-              <li>• Conversion history</li>
-              <li>• Keyboard shortcuts</li>
-              <li>• Copy & favorite units</li>
-            </ul>
-          </div>
-
-          {/* Links */}
-          <div>
-            <h3 className="font-semibold mb-3">Quick Links</h3>
-            <ul className="space-y-2 text-sm">
-              <li>
-                <Link
-                  href="/"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center gap-2"
-                >
-                  Back to Kit Home
-                </Link>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/valknarness/units-ui"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center gap-2"
-                >
-                  <Github className="h-4 w-4" />
-                  GitHub Repository
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://github.com/convert-units/convert-units"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center gap-2"
-                >
-                  <Code2 className="h-4 w-4" />
-                  convert-units Library
-                </a>
-              </li>
-            </ul>
-          </div>
-        </div>
-
-        {/* Bottom Bar */}
-        <div className="mt-8 pt-8 border-t flex flex-col sm:flex-row justify-between items-center gap-4 text-sm text-muted-foreground">
-          <div className="flex items-center gap-1">
-            Made with{' '}
-            <Heart className="h-4 w-4 text-red-500 fill-red-500" />{' '}
-            using Next.js 16 & Tailwind CSS 4
-          </div>
-          <div>
-            © {currentYear} Units UI. All rights reserved
-          </div>
-        </div>
-      </div>
-    </footer>
-  );
-}