From 3b367f747a311a888f36c09aa1e17c9d5ae284d0 Mon Sep 17 00:00:00 2001
From: David Montero Crespo <davidmonterocrespo24@gmail.com>
Date: Mon, 23 Mar 2026 12:19:25 -0300
Subject: [PATCH] Add SVG files for Arduino Nano and Arduino Uno boards

- Created arduino-nano.svg with detailed PCB, MCU, pins, and components.
- Created arduino-uno.svg with comprehensive design including USB connector, power jack, and pin headers.
---
 frontend/public/boards/arduino-mega.svg | 230 ++++++++++++++++++++++
 frontend/public/boards/arduino-nano.svg | 179 +++++++++++++++++
 frontend/public/boards/arduino-uno.svg  | 243 ++++++++++++++++++++++++
 frontend/src/pages/LandingPage.tsx      |  79 +-------
 4 files changed, 661 insertions(+), 70 deletions(-)
 create mode 100644 frontend/public/boards/arduino-mega.svg
 create mode 100644 frontend/public/boards/arduino-nano.svg
 create mode 100644 frontend/public/boards/arduino-uno.svg

diff --git a/frontend/public/boards/arduino-mega.svg b/frontend/public/boards/arduino-mega.svg
new file mode 100644
index 0000000..be6ad06
--- /dev/null
+++ b/frontend/public/boards/arduino-mega.svg
@@ -0,0 +1,230 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg
+  width="102.66mm"
+  height="50.80mm"
+  version="1.1"
+  viewBox="-4 0 102.66 50.80"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+>
+  <style>
+    text { font-size: 2px; font-family: monospace; }
+  </style>
+
+  <defs>
+    <g id="led-body" fill="#eee">
+      <rect x="0" y="0" height="1.2" width="2.6" fill="#c6c6c6" />
+      <rect x="0.6" y="-0.1" width="1.35" height="1.4" stroke="#aaa" stroke-width="0.05" />
+    </g>
+  </defs>
+
+  <filter id="ledFilter" x="-0.8" y="-0.8" height="2.2" width="2.8">
+    <feGaussianBlur stdDeviation="0.5" />
+  </filter>
+
+  <pattern id="pins-female" width="2.54" height="2.54" patternUnits="userSpaceOnUse">
+    <rect x="0" y="0" width="2.54" height="2.54" fill="#333"></rect>
+    <rect x="1.079" y="0.896" width="0.762" height="0.762" style="fill: #191919"></rect>
+    <path
+      transform="translate(1.079, 1.658) rotate(180 0 0)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.25"
+    ></path>
+    <path
+      transform="translate(1.841, 1.658) rotate(90 0 0)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.3; fill: #fff"
+    ></path>
+    <path
+      transform="translate(1.841, 0.896)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.15; fill: #fff"
+    ></path>
+    <path
+      transform="translate(1.079, 0.896) rotate(270 0 0)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.35"
+    ></path>
+  </pattern>
+
+  <pattern id="pin-male" width="2.54" height="4.80" patternUnits="userSpaceOnUse">
+    <rect ry="0.3" rx="0.3" width="2.12" height="4.80" fill="#565656" />
+    <ellipse cx="1" cy="1.13" rx="0.5" ry="0.5" fill="#aaa"></ellipse>
+    <ellipse cx="1" cy="3.67" rx="0.5" ry="0.5" fill="#aaa"></ellipse>
+  </pattern>
+
+  <!-- PCB -->
+  <path
+    d="M2.105.075v50.653h94.068v-1.206l2.412-2.412V14.548l-2.412-2.413V2.487L93.785.075zm14.443.907a1.505 1.505 0 01.03 0 1.505 1.505 0 011.504 1.505 1.505 1.505 0 01-1.504 1.506 1.505 1.505 0 01-1.506-1.506A1.505 1.505 0 0116.548.982zm71.154 0a1.505 1.505 0 01.03 0 1.505 1.505 0 011.505 1.505 1.505 1.505 0 01-1.505 1.506 1.505 1.505 0 01-1.506-1.506A1.505 1.505 0 0187.702.982zM64.818 15.454a1.505 1.505 0 011.504 1.506 1.505 1.505 0 01-1.504 1.505 1.505 1.505 0 01-1.506-1.505 1.505 1.505 0 011.506-1.506zm0 26.532a1.505 1.505 0 011.504 1.506 1.505 1.505 0 01-1.504 1.505 1.505 1.505 0 01-1.506-1.505 1.505 1.505 0 011.506-1.506zm-49.476 4.825a1.505 1.505 0 01.03 0 1.505 1.505 0 011.505 1.504 1.505 1.505 0 01-1.506 1.506 1.505 1.505 0 01-1.505-1.506 1.505 1.505 0 011.476-1.504zm78.39 0a1.505 1.505 0 01.03 0 1.505 1.505 0 011.504 1.504 1.505 1.505 0 01-1.504 1.506 1.505 1.505 0 01-1.506-1.506 1.505 1.505 0 011.476-1.504z"
+    fill="#2b6b99"
+  />
+
+  <!-- reset button -->
+  <rect transform="rotate(269.81)" x="-28.046" y="68.977" width="6.2151" height="6.0268" fill="#9b9b9b" />
+  <g fill="#e6e6e6">
+    <rect transform="rotate(269.81)" x="-29.725" y="69.518" width="1.695" height=".84994" />
+    <rect transform="rotate(269.81)" x="-29.741" y="71.4" width="1.695" height=".84994" />
+    <rect transform="rotate(269.81)" x="-29.764" y="73.425" width="1.695" height=".84994" />
+    <rect transform="rotate(269.81)" x="-21.831" y="73.59" width="1.695" height=".84994" />
+    <rect transform="rotate(269.81)" x="-21.854" y="69.517" width="1.695" height=".84994" />
+  </g>
+  <circle transform="rotate(269.81)" cx="-24.9" cy="72.092" r="1.5405" fill="#960000" stroke="#777" stroke-width="0.15" />
+
+  <!-- USB Connector -->
+  <g style="fill:#b3b2b2;stroke:#b3b2b2;stroke-width:0.010">
+    <ellipse cx="3.84" cy="9.56" rx="1.12" ry="1.03" />
+    <ellipse cx="3.84" cy="21.04" rx="1.12" ry="1.03" />
+    <g fill="#000">
+      <rect width="11" height="11.93" x="-0.05" y="9.72" rx="0.2" ry="0.2" opacity="0.24" />
+    </g>
+    <rect x="-4" y="9.37" height="11.85" width="14.46" />
+    <rect x="-4" y="9.61" height="11.37" width="14.05" fill="#706f6f" />
+    <rect x="-4" y="9.71" height="11.17" width="13.95" fill="#9d9d9c" />
+  </g>
+
+  <!-- Power jack -->
+  <g stroke-width=".254" fill="black" transform="translate(0 -4)">
+    <path d="m-2.58 48.53v2.289c0 0.279 0.228 0.508 0.508 0.508h1.722c0.279 0 0.508-0.228 0.508-0.508v-2.289z" fill="#252728" opacity=".3" />
+    <path d="m11.334 42.946c0-0.558-0.509-1.016-1.132-1.016h-10.043v9.652h10.043c0.622 0 1.132-0.457 1.132-1.016z" opacity=".3" />
+    <path d="m-2.072 40.914c-0.279 0-0.507 0.204-0.507 0.454v8.435c0 0.279 0.228 0.507 0.507 0.507h1.722c0.279 0 0.507-0.228 0.507-0.507v-8.435c0-0.249-0.228-0.454-0.507-0.454z" />
+    <path d="m-2.58 48.784v1.019c0 0.279 0.228 0.508 0.508 0.508h1.722c0.279 0 0.508-0.228 0.508-0.508v-1.019z" opacity=".3" />
+    <path d="m11.334 43.327c0.139 0 0.254 0.114 0.254 0.254v4.064c0 0.139-0.114 0.254-0.254 0.254" />
+    <path d="m11.334 42.438c0-0.558-0.457-1.016-1.016-1.016h-10.16v8.382h10.16c0.558 0 1.016-0.457 1.016-1.016z" />
+    <path d="m10.064 49.804h-9.906v-8.382h1.880c-1.107 0-1.363 1.825-1.363 3.826 0 1.765 1.147 3.496 3.014 3.496h6.374z" opacity=".3" />
+    <rect x="10.064" y="41.422" width=".254" height="8.382" fill="#ffffff" opacity=".2" />
+    <path d="m10.318 48.744v1.059c0.558 0 1.016-0.457 1.016-1.016v-0.364c0 0.313-1.016 0.320-1.016 0.320z" opacity=".3" />
+  </g>
+
+  <!-- Pin Headers -->
+  <g transform="translate(18.4 1.07)">
+    <rect width="25.78" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(44.81 1.07)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(66 1.07)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(27.93 47.5)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(49.63 47.5)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(71.34 47.5)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(90.1 0.8)">
+    <rect width="5.46" height="45.72" fill="url(#pins-female)"></rect>
+  </g>
+
+  <!-- MCU -->
+  <rect x="43" y="17.55" fill="#000" width="13.5" height="13.5" rx="0.5" />
+
+  <!-- Programming Headers -->
+  <g transform="translate(61.5 21.09)">
+    <rect width="4.80" height="7" fill="url(#pin-male)" />
+  </g>
+
+  <!-- LEDs -->
+  <g transform="translate(72.20 15.58)">
+    <use xlink:href="#led-body" />
+    <circle cx="1.3" cy="0.55" r="1.3" fill="#80ff80" filter="url(#ledFilter)" />
+  </g>
+  <text fill="#fff">
+    <tspan x="68" y="16.75">PWR</tspan>
+  </text>
+  <g transform="translate(26 13.86)">
+    <use xlink:href="#led-body" />
+  </g>
+  <g transform="translate(26 18.52)">
+    <use xlink:href="#led-body" />
+  </g>
+  <g transform="translate(26 20.75)">
+    <use xlink:href="#led-body" />
+  </g>
+  <text fill="#fff">
+    <tspan x="29.4" y="15">L</tspan>
+    <tspan x="29.4" y="19.8">TX</tspan>
+    <tspan x="29.4" y="22">RX</tspan>
+  </text>
+
+  <!-- Pin Labels -->
+  <rect x="28.27" y="7.6" width="31.5" height="0.16" fill="#fff"></rect>
+  <text fill="#fff" style="font-weight: 900">
+    <tspan x="40.84" y="9.8">PWM</tspan>
+  </text>
+
+  <rect x="60.5" y="11.8" width="25.4" height="0.16" fill="#fff"></rect>
+  <text fill="#fff" style="font-weight: 900">
+    <tspan x="65" y="14.2">COMMUNICATION</tspan>
+  </text>
+
+  <text
+    transform="translate(22.6 3.4) rotate(270 0 0)"
+    fill="#fff"
+    style="font-size: 2px; text-anchor: end; font-family: monospace"
+  >
+    <tspan x="0" dy="2.54">AREF</tspan>
+    <tspan x="0" dy="2.54">GND</tspan>
+    <tspan x="0" dy="2.54">13</tspan>
+    <tspan x="0" dy="2.54">12</tspan>
+    <tspan x="0" dy="2.54">11</tspan>
+    <tspan x="0" dy="2.54">10</tspan>
+    <tspan x="0" dy="2.54">9</tspan>
+    <tspan x="0" dy="2.54">8</tspan>
+    <tspan x="0" dy="4.08">7</tspan>
+    <tspan x="0" dy="2.54">6</tspan>
+    <tspan x="0" dy="2.54">5</tspan>
+    <tspan x="0" dy="2.54">4</tspan>
+    <tspan x="0" dy="2.54">3</tspan>
+    <tspan x="0" dy="2.54">2</tspan>
+    <tspan x="0" dy="2.54">TX&#x2192; 1</tspan>
+    <tspan x="0" dy="2.54">RX&#x2190; 0</tspan>
+    <tspan x="0" dy="3.34">TX3 14</tspan>
+    <tspan x="0" dy="2.54">RX3 15</tspan>
+    <tspan x="0" dy="2.54">TX2 16</tspan>
+    <tspan x="0" dy="2.54">RX2 17</tspan>
+    <tspan x="0" dy="2.54">TX1 18</tspan>
+    <tspan x="0" dy="2.54">RX1 19</tspan>
+    <tspan x="0" dy="2.54">SDA 20</tspan>
+    <tspan x="0" dy="2.54">SCL 21</tspan>
+  </text>
+
+  <rect x="36" y="41.46" width="12.44" height="0.16" fill="#fff"></rect>
+  <rect x="50" y="41.46" width="39" height="0.16" fill="#fff"></rect>
+  <text fill="#fff" style="font-weight: 900">
+    <tspan x="39" y="40.96">POWER</tspan>
+    <tspan x="65" y="40.96">ANALOG IN</tspan>
+  </text>
+  <text transform="translate(30.19 47) rotate(270 0 0)" fill="#fff" style="font-weight: 700">
+    <tspan x="0" dy="2.54">IOREF</tspan>
+    <tspan x="0" dy="2.54">RESET</tspan>
+    <tspan x="0" dy="2.54">3.3V</tspan>
+    <tspan x="0" dy="2.54">5V</tspan>
+    <tspan x="0" dy="2.54">GND</tspan>
+    <tspan x="0" dy="2.54">GND</tspan>
+    <tspan x="0" dy="2.54">Vin</tspan>
+    <tspan x="0" dy="3.74">A0</tspan>
+    <tspan x="0" dy="2.54">A1</tspan>
+    <tspan x="0" dy="2.54">A2</tspan>
+    <tspan x="0" dy="2.54">A3</tspan>
+    <tspan x="0" dy="2.54">A4</tspan>
+    <tspan x="0" dy="2.54">A5</tspan>
+    <tspan x="0" dy="2.54">A6</tspan>
+    <tspan x="0" dy="2.54">A7</tspan>
+    <tspan x="0" dy="3.74">A8</tspan>
+    <tspan x="0" dy="2.54">A9</tspan>
+    <tspan x="0" dy="2.54">A10</tspan>
+    <tspan x="0" dy="2.54">A11</tspan>
+    <tspan x="0" dy="2.54">A12</tspan>
+    <tspan x="0" dy="2.54">A13</tspan>
+    <tspan x="0" dy="1.84">A14</tspan>
+    <tspan x="0" dy="1.84">A15</tspan>
+  </text>
+
+  <!-- Logo -->
+  <text x="51.85" y="36" style="font-size:4px;font-weight:bold;line-height:1.25;fill:#fff">
+    Arduino MEGA
+  </text>
+</svg>
diff --git a/frontend/public/boards/arduino-nano.svg b/frontend/public/boards/arduino-nano.svg
new file mode 100644
index 0000000..af9eccc
--- /dev/null
+++ b/frontend/public/boards/arduino-nano.svg
@@ -0,0 +1,179 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg
+  width="44.9mm"
+  height="17.8mm"
+  viewBox="-1.4 0 44.9 17.8"
+  font-weight="bold"
+  version="1.1"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+>
+  <style>
+    text { font-size: 1px; font-family: monospace; }
+  </style>
+
+  <defs>
+    <filter id="solderPlate" style="color-interpolation-filters:sRGB;">
+      <feTurbulence result="r0" type="fractalNoise" baseFrequency="1" numOctaves="1" />
+      <feComposite result="r1" in="r0" in2="SourceGraphic" operator="arithmetic" k1=".6" k2=".6" k3="1.2" k4=".25" />
+      <feBlend result="r2" in="r1" in2="SourceGraphic" mode="luminosity" />
+      <feComposite result="r3" in="r2" in2="SourceGraphic" operator="in" />
+    </filter>
+    <pattern id="pins-tqfp-0.5mm" width="1" height=".5" patternUnits="userSpaceOnUse">
+      <rect fill="#333" width="1" height=".2" y=".17" />
+    </pattern>
+    <pattern id="pins-pth-0.75" width="2.54" height="2.54" patternUnits="userSpaceOnUse">
+      <circle r=".75" cx="1.27" cy="1.27" fill="#333" filter="url(#solderPlate)" />
+      <g stroke="#333" stroke-width=".05" paint-order="stroke fill">
+        <circle r=".375" cx="1.27" cy="1.27" fill="#eee" />
+      </g>
+    </pattern>
+    <pattern id="pins-pth-1.00" width="2.54" height="2.54" patternUnits="userSpaceOnUse">
+      <circle r=".75" cx="1.27" cy="1.27" fill="#333" filter="url(#solderPlate)" />
+      <g stroke="#333" stroke-width=".05" paint-order="stroke fill">
+        <circle r=".5" cx="1.27" cy="1.27" fill="#eee" />
+      </g>
+    </pattern>
+    <g id="led-body" fill="#eee">
+      <rect x="0" y="0" height="1.2" width="2.6" fill="#333" filter="url(#solderPlate)" />
+      <rect x=".6" y="-0.1" width="1.35" height="1.4" stroke="#aaa" stroke-width=".05" />
+    </g>
+    <filter id="ledFilter" x="-0.8" y="-0.8" height="2.2" width="2.8">
+      <feGaussianBlur stdDeviation=".5" />
+    </filter>
+  </defs>
+
+  <!-- PCB -->
+  <g id="pcb" fill="#fff">
+    <rect width="43.5" height="17.8" x="0" y="0" fill="#1b7e84" />
+    <circle cx="1" cy="1" r=".889" />
+    <circle cx="42.42" cy="1" r=".889" />
+    <circle cx="42.42" cy="16.6" r=".889" />
+    <circle cx="1" cy="16.6" r=".889" />
+  </g>
+
+  <!-- silkscreen -->
+  <g id="silkscreen" fill="#eee" text-anchor="middle">
+    <rect x="30.48" y="0" width="2.54" height="3.2" />
+    <rect x="35.56" y="14.6" width="2.54" height="3.2" />
+    <g fill="#1b7e84" transform="translate(1.27 1.27)">
+      <circle r=".85" cx="30.48" />
+      <circle r=".85" cx="35.56" cy="15.24" />
+    </g>
+    <g transform="translate(1.27 3)">
+      <text x="2.54">D12</text>
+      <text x="5.08">D11</text>
+      <text x="7.62">D10</text>
+      <text x="10.16">D9</text>
+      <text x="12.7">D8</text>
+      <text x="15.24">D7</text>
+      <text x="17.78">D6</text>
+      <text x="20.32">D5</text>
+      <text x="22.86">D4</text>
+      <text x="25.4">D3</text>
+      <text x="27.94">D2</text>
+      <text x="30.48" fill="#1b7e84">GND</text>
+      <text x="33.02">RST</text>
+      <text x="35.56" font-size="200%">&#x2193;</text>
+      <text x="35.56" y="1">RX0</text>
+      <text x="38.1" font-size="200%">&#x2191;</text>
+      <text x="38.1" y="1">TX1</text>
+    </g>
+    <g transform="translate(1.27 15.5)">
+      <text x="2.54">D13</text>
+      <text x="5.08">3V3</text>
+      <text x="7.62">AREF</text>
+      <text x="10.16">A0</text>
+      <text x="12.7">A1</text>
+      <text x="15.24">A2</text>
+      <text x="17.78">A3</text>
+      <text x="20.32">A4</text>
+      <text x="22.86">A5</text>
+      <text x="25.4">A6</text>
+      <text x="27.94">A7</text>
+      <text x="30.48">5V</text>
+      <text x="33.02">RST</text>
+      <text x="35.56" fill="#1b7e84">GND</text>
+      <text x="38.1">VIN</text>
+    </g>
+    <g transform="rotate(90)">
+      <text x="8.7" y="-22.5">RESET</text>
+      <text x="5.6" y="-32.2">TX</text>
+      <text x="5.6" y="-30.7" font-size="200%">&#x2193;</text>
+      <text x="7.6" y="-32.2">RX</text>
+      <text x="7.6" y="-30.7" font-size="200%">&#x2191;</text>
+      <text x="9.6" y="-30.7">ON</text>
+      <text x="11.6" y="-30.7">L</text>
+    </g>
+  </g>
+
+  <!-- MCU -->
+  <g id="mcu" transform="rotate(45 -2.978 23.39)">
+    <g fill="url(#pins-tqfp-0.5mm)" filter="url(#solderPlate)">
+      <rect x="-2.65" y="-1.975" width="5.3" height="3.95" />
+      <rect x="-2.65" y="-1.975" width="5.3" height="3.95" transform="rotate(90)" />
+    </g>
+    <rect x="-2.275" y="-2.275" width="4.55" height="4.55" fill="#444" />
+    <circle transform="rotate(45)" cx=".012" cy="-2.5" r=".35" fill="#222" />
+  </g>
+
+  <!-- pins -->
+  <g id="pins" fill="url(#pins-pth-0.75)">
+    <g id="pins-pin1" fill="#333" filter="url(#solderPlate)">
+      <rect x="38.495" y="0.395" width="1.75" height="1.75" />
+      <rect x="38.495" y="15.635" width="1.75" height="1.75" />
+    </g>
+    <rect x="2.54" width="38.1" height="2.54" />
+    <rect x="2.54" y="15.24" width="38.1" height="2.54" />
+  </g>
+
+  <!-- programming header -->
+  <g id="pgm-header" fill="url(#pins-pth-1.00)" stroke="#eee" stroke-width=".1">
+    <g id="pgm-pin1" stroke="none" fill="#333" filter="url(#solderPlate)">
+      <rect x="41.035" y="10.555" width="1.75" height="1.75" />
+    </g>
+    <rect x="38.1" y="5.08" width="5.08" height="7.62" />
+  </g>
+
+  <!-- USB mini type B -->
+  <g id="usb-mini-b" stroke-width=".1" paint-order="stroke fill">
+    <g fill="#333" filter="url(#solderPlate)">
+      <rect x=".3" y="3.8" width="1.6" height="9.8" />
+      <rect x="5.5" y="3.8" width="1.6" height="9.8" />
+      <rect x="7.3" y="7.07" width="1.1" height=".48" />
+      <rect x="7.3" y="7.82" width="1.1" height=".48" />
+      <rect x="7.3" y="8.58" width="1.1" height=".48" />
+      <rect x="7.3" y="9.36" width="1.1" height=".48" />
+      <rect x="7.3" y="10.16" width="1.1" height=".48" />
+    </g>
+    <rect x="-1.4" y="4.8" width="8.9" height="7.8" fill="#999" stroke-width=".26" />
+    <rect x="-1.25" y="5" width="8.6" height="7.4" fill="#ccc" stroke="#bbb" />
+    <g fill="none" stroke="#333" stroke-width=".26" stroke-linecap="round">
+      <path d="m2.6 5.9h-3.3v0.9h3.3m0 3.7h-3.3v0.9h3.3M-0.6 7.6l4.3 0.3v1.5l-4.3 0.3" />
+      <path d="m3.3 7.9v1.5" stroke-width="1" stroke-linecap="butt" />
+      <path d="m6 6.4v4.5" stroke-width=".35" />
+    </g>
+  </g>
+
+  <!-- LEDs -->
+  <g transform="translate(27.7 5)">
+    <use xlink:href="#led-body" />
+  </g>
+  <g transform="translate(27.7 7)">
+    <use xlink:href="#led-body" />
+  </g>
+  <g transform="translate(27.7 9)">
+    <use xlink:href="#led-body" />
+    <circle cx="1.3" cy=".55" r="1.3" fill="#80ff80" filter="url(#ledFilter)" />
+  </g>
+  <g transform="translate(27.7 11)">
+    <use xlink:href="#led-body" />
+  </g>
+
+  <!-- reset button -->
+  <g stroke-width=".1" paint-order="fill stroke">
+    <rect x="24.3" y="6.3" width="1" height="4.8" filter="url(#solderPlate)" fill="#333" />
+    <rect x="23.54" y="6.8" width="2.54" height="3.8" fill="#ccc" stroke="#888" />
+    <circle cx="24.8" cy="8.7" r="1" fill="#eeb" stroke="#777" />
+  </g>
+</svg>
diff --git a/frontend/public/boards/arduino-uno.svg b/frontend/public/boards/arduino-uno.svg
new file mode 100644
index 0000000..0d22476
--- /dev/null
+++ b/frontend/public/boards/arduino-uno.svg
@@ -0,0 +1,243 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg
+  width="72.58mm"
+  height="53.34mm"
+  version="1.1"
+  viewBox="-4 0 72.58 53.34"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+>
+  <defs>
+    <g id="led-body" fill="#eee">
+      <rect x="0" y="0" height="1.2" width="2.6" fill="#c6c6c6" />
+      <rect x="0.6" y="-0.1" width="1.35" height="1.4" stroke="#aaa" stroke-width="0.05" />
+    </g>
+  </defs>
+
+  <filter id="ledFilter" x="-0.8" y="-0.8" height="2.2" width="2.8">
+    <feGaussianBlur stdDeviation="0.5" />
+  </filter>
+
+  <pattern id="pins-female" width="2.54" height="2.54" patternUnits="userSpaceOnUse">
+    <rect x="0" y="0" width="2.54" height="2.54" fill="#333"></rect>
+    <rect x="1.079" y="0.896" width="0.762" height="0.762" style="fill: #191919"></rect>
+    <path
+      transform="translate(1.079, 1.658) rotate(180 0 0)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.25"
+    ></path>
+    <path
+      transform="translate(1.841, 1.658) rotate(90 0 0)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.3; fill: #fff"
+    ></path>
+    <path
+      transform="translate(1.841, 0.896)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.15; fill: #fff"
+    ></path>
+    <path
+      transform="translate(1.079, 0.896) rotate(270 0 0)"
+      d="m 0 0 v 0.762 l 0.433,0.433 c 0.046,-0.046 0.074,-0.109 0.074,-0.179 v -1.27 c 0,-0.070 -0.028,-0.133 -0.074,-0.179 z"
+      style="opacity: 0.35"
+    ></path>
+  </pattern>
+
+  <pattern id="pin-male" width="2.54" height="4.80" patternUnits="userSpaceOnUse">
+    <rect ry="0.3" rx="0.3" width="2.12" height="4.80" fill="#565656" />
+    <ellipse cx="1" cy="1.13" rx="0.5" ry="0.5" fill="#aaa"></ellipse>
+    <ellipse cx="1" cy="3.67" rx="0.5" ry="0.5" fill="#aaa"></ellipse>
+  </pattern>
+
+  <pattern id="mcu-leads" width="2.54" height="0.508" patternUnits="userSpaceOnUse">
+    <path
+      d="M 0.254,0 C 0.114,0 0,0.114 0,0.254 v 0 c 0,0.139 0,0.253 0,0.253 h 1.523 c 0,0 0,-0.114 0,-0.253 v 0 C 1.523,0.114 1.409,0 1.269,0 Z"
+      fill="#ddd"
+    />
+  </pattern>
+
+  <!-- PCB -->
+  <path
+    d="m0.999 0a1 1 0 0 0-0.999 0.999v51.34a1 1 0 0 0 0.999 0.999h64.04a1 1 0 0 0 0.999-0.999v-1.54l2.539-2.539v-32.766l-2.539-2.539v-11.43l-1.524-1.523zm14.078 0.835h0.325l0.212 0.041h0l0.105 0.021 0.300 0.124 0.270 0.180 0.229 0.229 0.180 0.270 0.017 0.042 0.097 0.234 0.01 0.023 0.050 0.252 0.013 0.066v0.325l-0.063 0.318-0.040 0.097-0.083 0.202-0 0.001-0.180 0.270-0.229 0.229-0.270 0.180-0.300 0.124-0.106 0.020-0.212 0.042h-0.325l-0.212-0.042-0.106-0.020-0.300-0.124-0.270-0.180-0.229-0.229-0.180-0.270-0 -0.001-0.083-0.202-0.040-0.097-0.063-0.318v-0.325l0.013-0.066 0.050-0.252 0.01-0.023 0.097-0.234 0.017-0.042 0.180-0.270 0.229-0.229 0.270-0.180 0.300-0.124 0.105-0.021zm50.799 15.239h0.325l0.212 0.042 0.105 0.021 0.300 0.124 0.270 0.180 0.229 0.229 0.180 0.270 0.014 0.035 0.110 0.264 0.01 0.051 0.053 0.267v0.325l-0.03 0.152-0.033 0.166-0.037 0.089-0.079 0.191-0 0.020-0.180 0.270-0.229 0.229-0.270 0.180-0.071 0.029-0.228 0.094-0.106 0.021-0.212 0.042h-0.325l-0.212-0.042-0.106-0.021-0.228-0.094-0.071-0.029-0.270-0.180-0.229-0.229-0.180-0.270-0 -0.020-0.079-0.191-0.036-0.089-0.033-0.166-0.030-0.152v-0.325l0.053-0.267 0.010-0.051 0.109-0.264 0.014-0.035 0.180-0.270 0.229-0.229 0.270-0.180 0.300-0.124 0.105-0.021zm0 27.94h0.325l0.180 0.036 0.138 0.027 0.212 0.087 0.058 0.024 0.029 0.012 0.270 0.180 0.229 0.229 0.180 0.270 0.124 0.300 0.063 0.319v0.325l-0.063 0.318-0.124 0.300-0.180 0.270-0.229 0.229-0.270 0.180-0.300 0.124-0.106 0.021-0.212 0.042h-0.325l-0.212-0.042-0.105-0.021-0.300-0.124-0.270-0.180-0.229-0.229-0.180-0.270-0.124-0.300-0.063-0.318v-0.325l0.063-0.319 0.124-0.300 0.180-0.270 0.229-0.229 0.270-0.180 0.029-0.012 0.058-0.024 0.212-0.087 0.137-0.027zm-52.07 5.080h0.325l0.212 0.041 0.106 0.021 0.300 0.124 0.270 0.180 0.229 0.229 0.121 0.182 0.058 0.087h0l0.114 0.275 0.01 0.023 0.063 0.318v0.325l-0.035 0.179-0.027 0.139-0.01 0.023-0.114 0.275h-0l-0.180 0.270-0.229 0.229-0.270 0.180-0.300 0.124-0.106 0.020-0.212 0.042h-0.325l-0.212-0.042-0.105-0.020-0.300-0.124-0.270-0.180-0.229-0.229-0.180-0.270-0.114-0.275-0.01-0.023-0.027-0.139-0.036-0.179v-0.325l0.063-0.318 0.01-0.023 0.114-0.275 0.058-0.087 0.121-0.182 0.229-0.229 0.270-0.180 0.300-0.124 0.105-0.021z"
+    fill="#2b6b99"
+  />
+
+  <!-- reset button -->
+  <rect x="3.816" y="1.4125" width="6.2151" height="6.0268" fill="#9b9b9b" />
+  <g fill="#e6e6e6">
+    <rect x="2.1368" y="1.954" width="1.695" height=".84994" />
+    <rect x="2.121" y="3.8362" width="1.695" height=".84994" />
+    <rect x="2.0974" y="5.8608" width="1.695" height=".84994" />
+    <rect x="10.031" y="6.0256" width="1.695" height=".84994" />
+    <rect x="10.008" y="1.9528" width="1.695" height=".84994" />
+  </g>
+  <circle cx="6.9619" cy="4.5279" r="1.5405" fill="#960000" stroke="#777" stroke-width="0.15" />
+
+  <!-- USB Connector -->
+  <g style="fill:#b3b2b2;stroke:#b3b2b2;stroke-width:0.010">
+    <ellipse cx="3.84" cy="9.56" rx="1.12" ry="1.03" />
+    <ellipse cx="3.84" cy="21.04" rx="1.12" ry="1.03" />
+    <g fill="#000">
+      <rect width="11" height="11.93" x="-0.05" y="9.72" rx="0.2" ry="0.2" opacity="0.24" />
+    </g>
+    <rect x="-4" y="9.37" height="11.85" width="14.46" />
+    <rect x="-4" y="9.61" height="11.37" width="14.05" fill="#706f6f" />
+    <rect x="-4" y="9.71" height="11.17" width="13.95" fill="#9d9d9c" />
+  </g>
+
+  <!-- Power jack -->
+  <g stroke-width=".254" fill="black">
+    <path d="m-2.58 48.53v2.289c0 0.279 0.228 0.508 0.508 0.508h1.722c0.279 0 0.508-0.228 0.508-0.508v-2.289z" fill="#252728" opacity=".3" />
+    <path d="m11.334 42.946c0-0.558-0.509-1.016-1.132-1.016h-10.043v9.652h10.043c0.622 0 1.132-0.457 1.132-1.016z" opacity=".3" />
+    <path d="m-2.072 40.914c-0.279 0-0.507 0.204-0.507 0.454v8.435c0 0.279 0.228 0.507 0.507 0.507h1.722c0.279 0 0.507-0.228 0.507-0.507v-8.435c0-0.249-0.228-0.454-0.507-0.454z" />
+    <path d="m-2.58 48.784v1.019c0 0.279 0.228 0.508 0.508 0.508h1.722c0.279 0 0.508-0.228 0.508-0.508v-1.019z" opacity=".3" />
+    <path d="m11.334 43.327c0.139 0 0.254 0.114 0.254 0.254v4.064c0 0.139-0.114 0.254-0.254 0.254" />
+    <path d="m11.334 42.438c0-0.558-0.457-1.016-1.016-1.016h-10.16v8.382h10.16c0.558 0 1.016-0.457 1.016-1.016z" />
+    <path d="m10.064 49.804h-9.906v-8.382h1.880c-1.107 0-1.363 1.825-1.363 3.826 0 1.765 1.147 3.496 3.014 3.496h6.374z" opacity=".3" />
+    <rect x="10.064" y="41.422" width=".254" height="8.382" fill="#ffffff" opacity=".2" />
+    <path d="m10.318 48.744v1.059c0.558 0 1.016-0.457 1.016-1.016v-0.364c0 0.313-1.016 0.320-1.016 0.320z" opacity=".3" />
+  </g>
+
+  <!-- Pin Headers -->
+  <g transform="translate(17.497 1.27)">
+    <rect width="25.78" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(44.421 1.27)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(26.641 49.53)">
+    <rect width="20.7" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+  <g transform="translate(49.501 49.53)">
+    <rect width="15.62" height="2.54" fill="url(#pins-female)"></rect>
+  </g>
+
+  <!-- MCU -->
+  <g>
+    <path
+      d="m64.932 41.627h-36.72c-0.209 0-0.379-0.170-0.379-0.379v-8.545c0-0.209 0.170-0.379 0.379-0.379h36.72c0.209 0 0.379 0.170 0.379 0.379v8.545c0 0.209-0.169 0.379-0.379 0.379z"
+      fill="#292c2d"
+    />
+    <path
+      d="m65.019 40.397c0 0.279-0.228 0.508-0.508 0.508h-35.879c-0.279 0-0.507 0.025-0.507-0.254v-6.338c0-0.279 0.228-0.508 0.507-0.508h35.879c0.279 0 0.508 0.228 0.508 0.508z"
+      opacity=".3"
+    />
+    <path
+      d="m65.019 40.016c0 0.279-0.228 0.508-0.508 0.508h-35.879c-0.279 0-0.507 0.448-0.507-0.508v-6.084c0-0.279 0.228-0.508 0.507-0.508h35.879c0.279 0 0.508 0.228 0.508 0.508z"
+      fill="#3c4042"
+    />
+    <rect transform="translate(29.205, 32.778)" fill="url(#mcu-leads)" height="0.508" width="35.56"></rect>
+    <rect transform="translate(29.205, 41.159) scale(1 -1)" fill="url(#mcu-leads)" height="0.508" width="35.56"></rect>
+    <g fill="#252728">
+      <circle cx="33.269" cy="36.847" r="1" />
+      <circle cx="59.939" cy="36.847" r="1" />
+      <path d="M65 38.05a1.13 1.13 0 010-2.26v2.27z" />
+    </g>
+  </g>
+
+  <!-- Programming Headers -->
+  <g transform="translate(14.1 4.4)">
+    <rect width="7" height="4.80" fill="url(#pin-male)" />
+  </g>
+  <g transform="translate(63 27.2) rotate(270 0 0)">
+    <rect width="7" height="4.80" fill="url(#pin-male)" />
+  </g>
+
+  <!-- LEDs -->
+  <g transform="translate(57.3, 16.21)">
+    <use xlink:href="#led-body" />
+    <circle cx="1.3" cy="0.55" r="1.3" fill="#80ff80" filter="url(#ledFilter)" />
+  </g>
+  <text fill="#fff">
+    <tspan x="60.88" y="17.5">ON</tspan>
+  </text>
+  <g transform="translate(26.87,11.69)">
+    <use xlink:href="#led-body" />
+  </g>
+  <g transform="translate(26.9, 16.2)">
+    <use xlink:href="#led-body" />
+  </g>
+  <g transform="translate(26.9, 18.5)">
+    <use xlink:href="#led-body" />
+  </g>
+  <text fill="#fff" style="text-anchor: end">
+    <tspan x="26.5" y="13">L</tspan>
+    <tspan x="26.5" y="17.5">TX</tspan>
+    <tspan x="26.5" y="19.8">RX</tspan>
+  </text>
+
+  <!-- Pin Labels -->
+  <rect x="28.27" y="10.34" width="36.5" height="0.16" fill="#fff"></rect>
+  <text fill="#fff" style="font-weight: 900">
+    <tspan x="40.84" y="9.48">DIGITAL (PWM ~)</tspan>
+  </text>
+  <text
+    transform="translate(22.6 4) rotate(270 0 0)"
+    fill="#fff"
+    style="font-size: 2px; text-anchor: end; font-family: monospace"
+  >
+    <tspan x="0" dy="2.54">AREF</tspan>
+    <tspan x="0" dy="2.54">GND</tspan>
+    <tspan x="0" dy="2.54">13</tspan>
+    <tspan x="0" dy="2.54">12</tspan>
+    <tspan x="0" dy="2.54">~11</tspan>
+    <tspan x="0" dy="2.54">~10</tspan>
+    <tspan x="0" dy="2.54">~9</tspan>
+    <tspan x="0" dy="2.54">8</tspan>
+    <tspan x="0" dy="4.08">7</tspan>
+    <tspan x="0" dy="2.54">~6</tspan>
+    <tspan x="0" dy="2.54">~5</tspan>
+    <tspan x="0" dy="2.54">4</tspan>
+    <tspan x="0" dy="2.54">~3</tspan>
+    <tspan x="0" dy="2.54">2</tspan>
+    <tspan x="0" dy="2.54">TX&#x2192;1</tspan>
+    <tspan x="0" dy="2.54">RX&#x2190;0</tspan>
+  </text>
+
+  <rect x="33.90" y="42.76" width="12.84" height="0.16" fill="#fff"></rect>
+  <rect x="49.48" y="42.76" width="14.37" height="0.16" fill="#fff"></rect>
+  <text fill="#fff" style="font-weight: 900">
+    <tspan x="41" y="44.96">POWER</tspan>
+    <tspan x="53.5" y="44.96">ANALOG IN</tspan>
+  </text>
+  <text transform="translate(29.19 49) rotate(270 0 0)" fill="#fff" style="font-weight: 700">
+    <tspan x="0" dy="2.54">IOREF</tspan>
+    <tspan x="0" dy="2.54">RESET</tspan>
+    <tspan x="0" dy="2.54">3.3V</tspan>
+    <tspan x="0" dy="2.54">5V</tspan>
+    <tspan x="0" dy="2.54">GND</tspan>
+    <tspan x="0" dy="2.54">GND</tspan>
+    <tspan x="0" dy="2.54">Vin</tspan>
+    <tspan x="0" dy="4.54">A0</tspan>
+    <tspan x="0" dy="2.54">A1</tspan>
+    <tspan x="0" dy="2.54">A2</tspan>
+    <tspan x="0" dy="2.54">A3</tspan>
+    <tspan x="0" dy="2.54">A4</tspan>
+    <tspan x="0" dy="2.54">A5</tspan>
+  </text>
+
+  <!-- Logo -->
+  <path
+    style="fill:none;stroke:#fff;stroke-width:1.03"
+    d="m 34.21393,12.01079 c -1.66494,-0.13263 -3.06393,1.83547 -2.37559,3.36182 0.66469,1.65332 3.16984,2.10396 4.36378,0.77797 1.15382,-1.13053 1.59956,-2.86476 3.00399,-3.75901 1.43669,-0.9801 3.75169,-0.0547 4.02384,1.68886 0.27358,1.66961 -1.52477,3.29596 -3.15725,2.80101 -1.20337,-0.27199 -2.06928,-1.29866 -2.56193,-2.37788 -0.6046,-1.0328 -1.39499,-2.13327 -2.62797,-2.42367 -0.2191,-0.0497 -0.44434,-0.0693 -0.66887,-0.0691 z"
+  />
+  <path
+    style="fill:none;stroke:#fff;stroke-width:0.56"
+    d="m 39.67829,14.37519 h 1.75141 m -0.89321,-0.8757 v 1.7514 m -7.30334,-0.8757 h 2.10166"
+  />
+  <text x="31" y="20.2" style="font-size:2.8px;font-weight:bold;line-height:1.25;fill:#fff">
+    ARDUINO
+  </text>
+
+  <rect
+    style="fill:none;stroke:#fff;stroke-width:0.1;stroke-dasharray:0.1, 0.1"
+    width="11"
+    height="5.45"
+    x="45.19"
+    y="11.83"
+    rx="1"
+    ry="1"
+  />
+
+  <text x="46.5" y="16" style="font-size:5px; line-height:1.25" fill="#fff">UNO</text>
+</svg>
diff --git a/frontend/src/pages/LandingPage.tsx b/frontend/src/pages/LandingPage.tsx
index 32f4154..622cbc2 100644
--- a/frontend/src/pages/LandingPage.tsx
+++ b/frontend/src/pages/LandingPage.tsx
@@ -246,73 +246,6 @@ const CircuitSchematic = () => (
 );
 
 /* ── Board SVGs ───────────────────────────────────────── */
-const BoardUno = () => (
-  <svg viewBox="0 0 120 80" className="board-svg">
-    <rect x="2" y="2" width="116" height="76" rx="4" fill="#006633" stroke="#004d26" strokeWidth="1.5" />
-    <rect x="42" y="22" width="36" height="36" rx="2" fill="#1a1a1a" stroke="#333" strokeWidth="1" />
-    <rect x="0" y="28" width="14" height="24" rx="2" fill="#555" stroke="#444" strokeWidth="1" />
-    <circle cx="108" cy="20" r="7" fill="#333" stroke="#222" strokeWidth="1" />
-    {[0,1,2,3,4,5,6,7,8,9,11,12,13].map((i) => (
-      <rect key={i} x={20 + i * 6.5} y="4" width="3" height="6" rx="0.5" fill="#d4a017" />
-    ))}
-    {[0,1,2,3,4,5].map((i) => (
-      <rect key={i} x={40 + i * 8} y="70" width="3" height="6" rx="0.5" fill="#d4a017" />
-    ))}
-    <circle cx="90" cy="12" r="2.5" fill="#00ff88" opacity="0.9" />
-    <text x="60" y="77" textAnchor="middle" fill="#00aa55" fontSize="5" fontFamily="monospace">Arduino Uno</text>
-  </svg>
-);
-
-const BoardNano = () => (
-  <svg viewBox="0 0 120 50" className="board-svg">
-    <rect x="2" y="2" width="116" height="46" rx="3" fill="#003399" stroke="#002277" strokeWidth="1.5" />
-    <rect x="44" y="12" width="24" height="24" rx="1.5" fill="#1a1a1a" stroke="#333" strokeWidth="1" />
-    <rect x="50" y="0" width="20" height="8" rx="2" fill="#555" stroke="#444" strokeWidth="1" />
-    {[0,1,2,3,4,5,6,7].map((i) => (
-      <rect key={i} x="4" y={8 + i * 4.5} width="6" height="3" rx="0.5" fill="#d4a017" />
-    ))}
-    {[0,1,2,3,4,5,6,7].map((i) => (
-      <rect key={i} x="110" y={8 + i * 4.5} width="6" height="3" rx="0.5" fill="#d4a017" />
-    ))}
-    <circle cx="28" cy="10" r="2" fill="#00ff88" opacity="0.9" />
-    <text x="60" y="44" textAnchor="middle" fill="#6699ff" fontSize="5" fontFamily="monospace">Arduino Nano</text>
-  </svg>
-);
-
-const BoardPico = () => (
-  <svg viewBox="0 0 120 60" className="board-svg">
-    <rect x="2" y="2" width="116" height="56" rx="3" fill="#f0f0f0" stroke="#ccc" strokeWidth="1.5" />
-    <rect x="40" y="14" width="32" height="32" rx="2" fill="#1a1a1a" stroke="#333" strokeWidth="1" />
-    <rect x="44" y="18" width="24" height="24" rx="1" fill="#222" stroke="#444" strokeWidth="0.5" />
-    <rect x="50" y="0" width="20" height="8" rx="2" fill="#888" stroke="#666" strokeWidth="1" />
-    {[0,1,2,3,4,5,6].map((i) => (
-      <rect key={i} x="4" y={10 + i * 6} width="6" height="4" rx="0.5" fill="#888" />
-    ))}
-    {[0,1,2,3,4,5,6].map((i) => (
-      <rect key={i} x="110" y={10 + i * 6} width="6" height="4" rx="0.5" fill="#888" />
-    ))}
-    <circle cx="88" cy="10" r="2.5" fill="#00ccff" opacity="0.9" />
-    <text x="60" y="57" textAnchor="middle" fill="#555" fontSize="5" fontFamily="monospace">Raspberry Pi Pico</text>
-  </svg>
-);
-
-const BoardMega = () => (
-  <svg viewBox="0 0 160 80" className="board-svg">
-    <rect x="2" y="2" width="156" height="76" rx="4" fill="#006633" stroke="#004d26" strokeWidth="1.5" />
-    <rect x="55" y="20" width="50" height="40" rx="2" fill="#1a1a1a" stroke="#333" strokeWidth="1" />
-    <rect x="0" y="28" width="14" height="24" rx="2" fill="#555" stroke="#444" strokeWidth="1" />
-    <circle cx="148" cy="20" r="7" fill="#333" stroke="#222" strokeWidth="1" />
-    {Array.from({length: 18}).map((_, i) => (
-      <rect key={i} x={18 + i * 7} y="4" width="3" height="6" rx="0.5" fill="#d4a017" />
-    ))}
-    {Array.from({length: 18}).map((_, i) => (
-      <rect key={i} x={18 + i * 7} y="70" width="3" height="6" rx="0.5" fill="#d4a017" />
-    ))}
-    <circle cx="130" cy="12" r="2.5" fill="#00ff88" opacity="0.9" />
-    <circle cx="138" cy="12" r="2.5" fill="#ff6600" opacity="0.9" />
-    <text x="80" y="77" textAnchor="middle" fill="#00aa55" fontSize="5" fontFamily="monospace">Arduino Mega 2560</text>
-  </svg>
-);
 
 const BoardATtiny85 = () => (
   <svg viewBox="0 0 60 50" className="board-svg" style={{ maxWidth: '100px' }}>
@@ -548,17 +481,23 @@ export const LandingPage: React.FC = () => {
           </div>
           <div className="boards-row">
             <div className="board-card-sm">
-              <div className="board-img-box"><BoardUno /></div>
+              <div className="board-img-box">
+                <img src="/boards/arduino-uno.svg" alt="Arduino Uno" className="board-img-sm" />
+              </div>
               <span className="board-name-sm">Arduino Uno</span>
               <span className="board-chip-sm">ATmega328p · 32 KB</span>
             </div>
             <div className="board-card-sm">
-              <div className="board-img-box"><BoardNano /></div>
+              <div className="board-img-box">
+                <img src="/boards/arduino-nano.svg" alt="Arduino Nano" className="board-img-sm" />
+              </div>
               <span className="board-name-sm">Arduino Nano</span>
               <span className="board-chip-sm">ATmega328p · 32 KB</span>
             </div>
             <div className="board-card-sm">
-              <div className="board-img-box"><BoardMega /></div>
+              <div className="board-img-box">
+                <img src="/boards/arduino-mega.svg" alt="Arduino Mega 2560" className="board-img-sm" />
+              </div>
               <span className="board-name-sm">Arduino Mega 2560</span>
               <span className="board-chip-sm">ATmega2560 · 256 KB</span>
             </div>