diff --git a/html/index.html b/html/index.html
index b8758e2..c5926dd 100644
--- a/html/index.html
+++ b/html/index.html
@@ -4,6 +4,9 @@
     <title>FreeSwitchOS Main Page</title>
   </head>
   <body>
+    <div id="ports"> <img id="port1" width="40" height="40" src="port.svg"/> <img id="port2" width="40" height="40" src="port.svg"/>
+      <img id="port3" width="40" height="40" src="port.svg"/> <img id="port4" width="40" height="40" src="port.svg"/> <img id="sfp1" width="60" height="60" src="sfp.svg"/>
+      <img id="sfp2" width="60" height="60" src="sfp.svg"/> </div>
     <h1>Switch Configuration</h1>
     <table>
       <tr> <th>Setting</th> <th></th> </tr>
diff --git a/html/port.svg b/html/port.svg
index f323dee..93a181b 100644
--- a/html/port.svg
+++ b/html/port.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns:svg="http://www.w3.org/2000/svg">
+<svg  viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
 <g id="layer1" transform="translate(-314.07 -485.06)">
 <g id="g1" transform="translate(256.16 417.12)">
 <rect id="r1" style="stroke:#0a0a0a;stroke-linecap:square;stroke-width:4;fill:#ffffff" rx="4.514" ry="4.514" height="90.625" width="117.88" y="69.93" x="59.896"/>
diff --git a/html/sfp.svg b/html/sfp.svg
index 21373d2..b6711c2 100644
--- a/html/sfp.svg
+++ b/html/sfp.svg
@@ -3,23 +3,21 @@
  <g id="layer1" transform="translate(-41.68,-55.95)">
   <g id="g1" transform="translate(-177.45,-12.07)">
    <g id="g2" transform="matrix(1.46,0,0,1.44,51.31,-317.4)">
-    <path
+    <path id="p1"
       d="m 117.94442,272.67478 h 7.64646 c 0.21062,0 0.38018,0.16649 0.38018,0.3733 v 4.69239 c 0,0.2068 -0.16956,0.3733 -0.38018,0.3733 h -2.1027 v 0.31956 h -3.44117 v -0.31956 h -2.1027 c -0.21062,0 -0.38018,-0.16649 -0.38018,-0.3733 v -4.69239 c 0,-0.20681 0.16956,-0.3733 0.38018,-0.3733 z"
-      style="fill:#ffffff;stroke:#000000;stroke-width:0.4" id="p1" />
-    <path
-      d="m 118.36775,273.15632 h 6.79794 c 0.18725,0 0.33798,0.14695 0.33798,0.32946 v 4.14153 c 0,0.18252 -0.15074,0.32946 -0.33798,0.32946 h -6.79794 c -0.18724,0 -0.33798,-0.14695 -0.33798,-0.32946 v -4.14153 c 0,-0.18252 0.15074,-0.32946 0.33798,-0.32946 z"
-      style="fill:#000000;stroke-width:0.26"
-      id="p2" />
+      style="fill:#ffffff;stroke:#000000;stroke-width:0.4"/>
+    <path  id="p2"
+      d="m 118.36775,273.15632 h 6.79794 c 0.18725,0 0.338,0.14695 0.338,0.32946 v 4.14153 c 0,0.18252 -0.15074,0.32946 -0.338,0.32946 h -6.79794 c -0.18724,0 -0.338,-0.14695 -0.338,-0.32946 v -4.14153 c 0,-0.18252 0.15074,-0.32946 0.338,-0.32946 z"
+      style="fill:#000000;stroke-width:0.26" />
     <path d="m 118.65,273.53 h 6.24 v 4.05 h -6.24 z" style="fill:#1a1a1a;stroke-width:0.26" id="p3" />
     <path d="m 118.86,276.61 h 5.82" style="fill:#1a1a1a;stroke:#000000;stroke-width:0.26" id="p4" />
     <path d="m 124.05,274.25 h 1.39 v 0.72 h -1.39 z" style="fill:url(#linearGradient63614);stroke-width:0.26" id="p5" />
     <path d="m 124.05,276 h 1.39 v 0.72 h -1.39 z" style="fill:url(#linearGradient63616);stroke-width:0.26" id="p6" />
     <path transform="matrix(0.26,0,0,0.26,116.9,272.11)" d="M 7.3648613,7.0152205 H 29.369861" style="opacity:0.61257;fill:#4d4d4d;stroke:#4d4d4d;filter:url(#filter17794-0)" id="p7" />
    </g>
-   <g id="g3" style="opacity:1;fill:#37d733;"
-     transform="matrix(0.93,0,0,0.92,62.18,-43.11)">
-    <circle id="c1" cx="176.86" cy="125.7" r="0.93" />
-    <circle r="0.93" cy="125.7" cx="180.84" id="c2" />
+   <g id="g3" style="opacity:1;fill:#37d733;" transform="matrix(0.93,0,0,0.92,62.18,-43.11)">
+    <circle id="c1" cx="176.86" cy="125.7" r="0.93"/>
+    <circle id="c2" r="0.93" cy="125.7" cx="180.84"/>
    </g>
   </g>
  </g>
