diff --git a/public/scripts/ajaxForm.js b/public/scripts/ajaxForm.js
new file mode 100644
index 0000000..892473e
--- /dev/null
+++ b/public/scripts/ajaxForm.js
@@ -0,0 +1,62 @@
+"use strict";
+
+// Update the form with the answer
+function doActions(parent, data) {
+	// Redirect the user
+	if (data.redirect !== "") {
+		window.location.replace(data.redirect);
+	}
+
+	// Refresh the page
+	if (data.refresh) {
+		window.location.reload();
+	}
+
+	// Reset the form
+	if (data.reset) {
+		parent.reset();
+	}
+
+	// Update the form error
+	parent.querySelector('.form-error').innerHTML = data.error;
+	setTimeout(function() {
+		parent.querySelector('.form-error').innerHTML = 0;
+	}, 3000);
+	
+	// Update the form message
+	parent.querySelector('.form-message').innerHTML = data.message;
+	setTimeout(function() {
+		parent.querySelector('.form-message').innerHTML = 0;
+	}, 3000);
+}
+
+// Add event listener
+document.querySelectorAll('.ajax-form').forEach(function(element) {
+	element.onsubmit = function(event) {
+		event.preventDefault();
+		if (
+			(!event.target.hasAttribute("data-form-validator")
+				|| eval(event.target.getAttribute("data-form-validator")))
+			&& (!event.target.hasAttribute("data-form-confirmation")
+				|| confirm(event.target.getAttribute("data-form-confirmation")))
+		) {
+			// Get form data
+			const data = new URLSearchParams();
+			for (const pair of new FormData(event.target)) {
+				let pairKey = pair[0];
+				let pairValue = pair[1];
+				data.append(pairKey, pairValue);
+			}
+
+			// Fetch data
+			fetch(window.location.href, {
+				method: 'post',
+				body: data
+			}).then(function(response) {
+				response.json().then(function(json) {
+					doActions(event.target, json);
+				});
+			});
+		}
+	};
+});
\ No newline at end of file
diff --git a/public/styles/colors.css b/public/styles/colors.css
index ff849b1..d7b4902 100644
--- a/public/styles/colors.css
+++ b/public/styles/colors.css
@@ -7,4 +7,19 @@
 	--secondary-dark: #3b1c11;
 	--light: #f8f5ec;
 	--dark: #131007;
+	--green: #19b340;
+	--green-light: #79ec96;
+	--green-dark: #0a4318;
+}
+
+.color-green {
+	color: var(--green);
+}
+
+.color-green-light {
+	color: var(--green-light);
+}
+
+.color-green-dark {
+	color: var(--green-dark);
 }
\ No newline at end of file
diff --git a/public/styles/main.css b/public/styles/main.css
index f0737c3..a7e92ab 100644
--- a/public/styles/main.css
+++ b/public/styles/main.css
@@ -58,6 +58,10 @@
 	box-shadow: 0 0 0.5em black;
 }
 
+code {
+	color: black;
+}
+
 .container {
 	padding-top: 2em;
 }
\ No newline at end of file
diff --git a/src/Controller/MainController.php b/src/Controller/MainController.php
index dc5d347..895674b 100644
--- a/src/Controller/MainController.php
+++ b/src/Controller/MainController.php
@@ -4,6 +4,7 @@
 use Symfony\Component\HttpFoundation\Response;
 use App\Entity\WorkspaceEntity;
 use App\Repository\WorkspaceRepository;
+use App\Form\WorkspaceAddForm;
 
 /**
  * Main controller
@@ -23,9 +24,13 @@
         /** @var workspaceRepository WorkspaceRepository */
         $workspaceRepository = $entityManager->getRepository(WorkspaceEntity::class);
         $workspaces = $workspaceRepository->findAll();
+        
+        // Add workspace form
+        $workspaceAddForm = $this->createNamedCustomForm("addForm", WorkspaceAddForm::class);
 
         return $this->render("workspaceSelector.html.twig", [
-            "workspaces" => $workspaces
+            "workspaces" => $workspaces,
+            "workspaceAddForm" => $workspaceAddForm,
         ]);
     }
 }
\ No newline at end of file
diff --git a/src/Form/WorkspaceAddForm.php b/src/Form/WorkspaceAddForm.php
new file mode 100644
index 0000000..685277d
--- /dev/null
+++ b/src/Form/WorkspaceAddForm.php
@@ -0,0 +1,30 @@
+<?php
+namespace App\Form;
+
+use Symfony\Component\Form\Extension\Core\Type\SubmitType;
+use Symfony\Component\Form\Extension\Core\Type\TextType;
+
+/**
+ * Form for adding new workspace
+ */
+class WorkspaceAddForm extends AbstractFormManager
+{
+
+    /**
+     * {@inheritdoc}
+     */
+    public function getTemplate(): string
+    {
+        return '_includes/html/form/workspaceAdd.html.twig';
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    protected function addFields($formBuilder, $options): void
+    {
+        $formBuilder->add('name', TextType::class, [
+            'required' => true
+        ])->add('submit', SubmitType::class);
+    }
+}
\ No newline at end of file
diff --git a/templates/_includes/html/base.html.twig b/templates/_includes/html/base.html.twig
index 680277c..36707b5 100644
--- a/templates/_includes/html/base.html.twig
+++ b/templates/_includes/html/base.html.twig
@@ -1,8 +1,8 @@
 {% set styles=[
-    "https://meyerweb.com/eric/tools/css/reset/reset.css",
-    "https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css",
     "https://fonts.googleapis.com/css2?family=Kanit",
     "https://fonts.googleapis.com/css2?family=Asap",
+    "https://meyerweb.com/eric/tools/css/reset/reset.css",
+    "https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css",
     baseUrl~"icofont/icofont.css",
     baseUrl~"styles/card.css",
     baseUrl~"styles/colors.css",
@@ -12,6 +12,7 @@
 ]|merge(styles|default([])) %}
 
 {% set scripts=[
+    baseUrl~"scripts/ajaxForm.js",
 ]|merge(scripts|default([])) %}
 
 {% set page=page|default("N/A") %}
diff --git a/templates/_includes/html/form/workspaceAdd.html.twig b/templates/_includes/html/form/workspaceAdd.html.twig
new file mode 100644
index 0000000..c133e16
--- /dev/null
+++ b/templates/_includes/html/form/workspaceAdd.html.twig
@@ -0,0 +1,9 @@
+{{ form_start(form, {'attr': {'class': 'ajax-form'}}) }}
+<div>
+	{{ form_label(form.name, 'Nom', {'label_attr': {'class': 'input-text-label'}}) }}
+	{{ form_widget(form.name, {'attr': {'class': 'w-100'}}) }}
+</div>
+{{ form_widget(form.submit, {'attr': {'class': 'w-100'}, 'label': 'Nouveau workspace'}) }}
+<p class="form-error"></p>
+<p class="form-message"></p>
+{{ form_end(form) }}
\ No newline at end of file
diff --git a/templates/_includes/html/genericForm.html.twig b/templates/_includes/html/genericForm.html.twig
new file mode 100644
index 0000000..f692c92
--- /dev/null
+++ b/templates/_includes/html/genericForm.html.twig
@@ -0,0 +1,6 @@
+{% if form.template is null %}
+{{ form_start(form.formView) }}
+{{ form_end(form.formView) }}
+{% else %}
+{% include form.template with {'form': form.formView} only %}
+{% endif %}
\ No newline at end of file
diff --git a/templates/workspaceSelector.html.twig b/templates/workspaceSelector.html.twig
index 41a0684..ccbf5ed 100644
--- a/templates/workspaceSelector.html.twig
+++ b/templates/workspaceSelector.html.twig
@@ -3,7 +3,7 @@
 {% set page="Workspaces" %}
 
 {% block pageContent %}
-<div class="col-12">
+<div class="col-9">
 	<div class="card">
 		<div class="card-header">
 			<h2>Workspaces</h2>
@@ -15,14 +15,19 @@
 						<td>ID</td>
 						<td>Nom</td>
 						<td>Actif</td>
+						<td></td>
 					</tr>
 				</thead>
 				<tbody>
 					{% for workspace in workspaces %}
 					<tr>
-						<td>{{ workspace.id }}</td>
+						<td><code>
+								{{ workspace.id }}
+							</code></td>
 						<td>{{ workspace.name }}</td>
-						<td>{{ workspace.active }}</td>
+						<td>{% if workspace.active %}<i
+							class="icofont-checked color-green"></i> {% endif %}</td>
+						<td></td>
 					</tr>
 					{% endfor %}
 				</tbody>
@@ -30,4 +35,14 @@
 		</div>
 	</div>
 </div>
+<div class="col-3">
+	<div class="card">
+		<div class="card-header">
+			<h2>Ajouter un workspace</h2>
+		</div>
+		<div class="card-body">
+			{% include '_includes/html/genericForm.html.twig' with {'form': workspaceAddForm} only %}
+		</div>
+	</div>
+</div>
 {% endblock %}
\ No newline at end of file