diff --git a/css/glowingbear.css b/css/glowingbear.css
index 82697ac..c7b4a2a 100644
--- a/css/glowingbear.css
+++ b/css/glowingbear.css
@@ -109,13 +109,18 @@ input#sendMessage {
 .panel input, .panel .input-group {
     max-width: 300px;
 }
-input[type=text], input[type=password], .badge {
+input[type=text], input[type=number], input[type=url], input[type=password], .badge {
     border: 0;
     border-radius: 0;
     color: #ccc;
     box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.8) inset;
     background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
 }
+input[type=number]::-webkit-inner-spin-button,
+input[type=number]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+}
 #topbar {
     position: fixed;
     width: 100%;
diff --git a/index.html b/index.html
index e24e8a7..359c271 100644
--- a/index.html
+++ b/index.html
@@ -57,8 +57,8 @@
                   <div class="form-group">
                     <label class="control-label" for="host">WeeChat relay hostname and port number</label>
                     <div class="input-group">
-                      <input type="text" class="form-control monospace" id="host" ng-model="host" placeholder="Address">
-                      <input type="text" class="form-control monospace" id="port" ng-model="port" placeholder="9001">
+                      <input type="url" class="form-control monospace" id="host" ng-model="host" placeholder="Address" autocorrect="off" autocomplete="off" autocapitalize="off">
+                      <input type="number" pattern="[0-9]*" class="form-control monospace" id="port" ng-model="port" placeholder="9001">
                     </div>
                     <label class="control-label" for="password">WeeChat relay password</label>
                     <input type="password" class="form-control monospace" id="password" ng-model="password" placeholder="Password">