diff --git a/web/API/stations.php b/web/API/stations.php
index b8a981d..8e2401b 100644
--- a/web/API/stations.php
+++ b/web/API/stations.php
@@ -48,4 +48,23 @@
         }
 
         return $res;
+    }
+
+    function add($params) {
+        $stations  = new \wsos\database\core\table(\DAL\station::class);
+
+        $myStation = new \DAL\station();
+        $myStation->name->set($params["name"]);
+        $myStation->description->set($params["description"]);
+        $myStation->locator->set([
+            "gps" => [
+                "lat" => floatval($params["lat"]),
+                "lon" => floatval($params["lon"]),
+                "alt" => floatval($params["alt"])
+            ] 
+        ]);
+
+        $myStation->commit();
+
+        return ["id" => $myStation->id->get()];
     }
\ No newline at end of file
diff --git a/web/VIEWS/dashboard.html b/web/VIEWS/dashboard.html
index aed49e9..f94edf6 100644
--- a/web/VIEWS/dashboard.html
+++ b/web/VIEWS/dashboard.html
@@ -134,6 +134,9 @@
                       <div class="card">
                         <div class="card-header">
                           <h3 class="card-title">Stations</h3>
+                          <button type="button" class="btn btn-primary ms-auto" data-bs-toggle="modal" onclick="updateStationMap()" data-bs-target="#newStationModal">
+                            + Add
+                          </button>
                         </div>
                         <div class="scrollable" style="height: 274px;">
                           <table class="table card-table table-vcenter">
@@ -182,6 +185,68 @@
                 </div>
               </div>
 
+              <div class="modal" id="newStationModal" tabindex="-1">
+                <div class="modal-dialog modal-lg" role="document">
+                  <div class="modal-content">
+                    <div class="modal-header">
+                      <h5 class="modal-title">New station</h5>
+                      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                    </div>
+                    <div class="modal-body">
+                      <div class="row">
+                        <div class="col-lg-12">
+                          <div class="mb-3">
+                            <label class="form-label">Station name</label>
+                            <input class="form-control" type="text" id="station-name">
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="modal-body">
+                      <div class="row">
+                        <div class="col-lg-6">
+                          <div class="mb-3">
+                            <label class="form-label">Station LAT</label>
+                            <input type="number" step="0.001" id="station-lat" placeholder="0.0" onchange="updateStationMap()" class="form-control">
+                          </div>
+                        </div>
+                        <div class="col-lg-6">
+                          <div class="mb-3">
+                            <label class="form-label">Station LON</label>
+                            <input type="number" step="0.001" id="station-lon" placeholder="0.0" onchange="updateStationMap()" class="form-control">
+                          </div>
+                        </div>
+
+                        <div id="stationMap" style="height:200px;" class="mt-1 w-100">
+                        </div>
+
+                        <div class="col-lg-12 mt-3">
+                          <div class="mb-3">
+                            <label class="form-label">Station Altitude [meters]</label>
+                            <input type="number" step="1" id="station-alt" placeholder="0" class="form-control">
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="modal-body">
+                      <div class="row">
+                        <div class="col-lg-12">
+                          <div class="mb-3">
+                            <label class="form-label">Station description</label>
+                            <textarea class="form-control" id="station-description"></textarea>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="modal-footer">
+                      <button type="button" class="btn me-auto" data-bs-dismiss="modal">Close</button>
+                      <button type="button" onclick="addStation()" class="btn btn-primary" data-bs-dismiss="modal">Add</button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+              <script src="/static/js/dashboard.js"></script>
             <!-- Tabler Core -->
             <script src="./dist/js/tabler.min.js?1668287865" defer=""></script>
         </div>
diff --git a/web/static/js/dashboard.js b/web/static/js/dashboard.js
new file mode 100644
index 0000000..701813d
--- /dev/null
+++ b/web/static/js/dashboard.js
@@ -0,0 +1,46 @@
+function addStation() {
+    var station = new FormData();
+
+    var name        = document.getElementById("station-name").value;
+    var lat         = document.getElementById("station-lat").value;
+    var lon         = document.getElementById("station-lon").value;
+    var alt         = document.getElementById("station-alt").value;
+    var description = document.getElementById("station-description").value;
+
+    station.append('name',         name);
+    station.append('lat',          lat);
+    station.append('lon',          lon);
+    station.append('alt',          alt);
+    station.append('description',  description);
+
+    var xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function() {
+        if (this.readyState == 4 && this.status == 200) {
+            alert(JSON.parse(this.responseText).id);
+        }
+    };
+
+    xhttp.open("POST", "/api/station/add", true);
+    xhttp.send(station);
+}
+
+function updateStationMap() {
+    setTimeout(function(){ stationMap.invalidateSize()}, 400);
+  
+    var lat = document.getElementById("station-lat").value;
+    var lon = document.getElementById("station-lon").value;
+  
+    var newLatLon = new L.LatLng(lat, lon);
+    stationMarker.setLatLng(newLatLon); 
+  
+    stationMap.setView(stationMarker.getLatLng(), 5); 
+  }
+  
+
+var stationMap = L.map('stationMap').setView([0, 0], 1);
+    
+L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+}).addTo(stationMap);
+
+var stationMarker = L.marker([0, 0]).addTo(stationMap).bindPopup('Your station coordinates');