diff --git a/frontend/static/js/api/tournament/Tournaments.js b/frontend/static/js/api/tournament/Tournaments.js
index dc29178..2ed8e3f 100644
--- a/frontend/static/js/api/tournament/Tournaments.js
+++ b/frontend/static/js/api/tournament/Tournaments.js
@@ -32,17 +32,13 @@ class Tourmanents
 	 * @param {Number} nb_players 
 	 * @param {Number} nb_players_by_game 
 	 * @param {String} name 
-	 * @returns 
+	 * @returns {Response}
 	 */
 	async createTournament(nb_players,  nb_players_by_game, name = "")
 	{
 		let response = await this.client._post("/api/tournaments/", {nb_players: nb_players, nb_players_by_game: nb_players_by_game, name: name});
 
-		if (response.status !== 200)
-			return response.status;
-
-		let response_data = await response.json();
-		return response_data;
+		return response;
 	}
 
 	/**
diff --git a/frontend/static/js/lang/en.json b/frontend/static/js/lang/en.json
index 5104587..406142b 100644
--- a/frontend/static/js/lang/en.json
+++ b/frontend/static/js/lang/en.json
@@ -46,5 +46,10 @@
 	"matchmakingTitle": "Matchmaking",
 	"matchmakingStartSearch": "Find a game",
 	"matchmakingStopSearch": "Stop matchmaking",
-	"matchmakingNbPlayers": "Number of players"
+	"matchmakingNbPlayers": "Number of players",
+	"TournamentCreateTitle": "Create tournament",
+	"TournamentCreateButton": "Create tournament",
+	"TournamentCreateTournamentName": "Tournament Name",
+	"TournamentCreateNbPlayerByGame": "Number of player in a game",
+	"TournamentCreateNbPlayer": "Number of players in the tournament"
 }
diff --git a/frontend/static/js/views/tournament/TournamentCreateView.js b/frontend/static/js/views/tournament/TournamentCreateView.js
index ffd7690..58e2bb1 100644
--- a/frontend/static/js/views/tournament/TournamentCreateView.js
+++ b/frontend/static/js/views/tournament/TournamentCreateView.js
@@ -1,4 +1,4 @@
-import {client, navigateTo} from "../../index.js";
+import {client, lang, navigateTo} from "../../index.js";
 import { clear, fill_errors } from "../../utils/formUtils.js";
 import AbstractAuthenticatedView from "../abstracts/AbstractAuthenticatedView.js";
 
@@ -13,13 +13,11 @@ export default class extends AbstractAuthenticatedView
 	async create()
 	{
 		let name = document.getElementById("name-input").value;
-		let nb_players = document.getElementById("nb_players-input").value;
-		let nb_players_by_game = document.getElementById("nb_players_by_game-input").value;
+		let nb_players = document.getElementById("nb-players-input").value;
+		let nb_players_by_game = document.getElementById("nb-players-by-game-input").value;
 
-		let response_data = await client.tournaments.createTournament(nb_players, nb_players_by_game, name);
-
-		if (response_data === null)
-			return;
+		let response = await client.tournaments.createTournament(nb_players, nb_players_by_game, name);
+		let response_data = await response.json();
 
 		let id = response_data.id;
 		if (id !== undefined)
@@ -37,16 +35,33 @@ export default class extends AbstractAuthenticatedView
 		document.getElementById("create-button").onclick = this.create;
 	}
 
-	async getHtml()
-	{
-		return `
-			<input type="text" id="name-input" placeholder="Tournament name">
-			<span id="name"></span>
-			<input type="number" id="nb_players-input" placeholder="Number of players in tournament">
-			<span id="nb_players"></span>
-			<input type="number" id="nb_players_by_game-input" placeholder="Number of players by game">
-			<span id="nb_players_by_game"></span>
-			<input type="button" id="create-button" value="Create tournament">
+	async getHtml() {
+
+		return /* HTML */ `
+			<div class='container-fluid'>
+				<div class='border border-2 rounded bg-light-subtle mx-auto p-2 col-md-7 col-lg-4'>
+					<h4 class='text-center fw-semibold mb-4' id="title">${lang.get("TournamentCreateTitle")}</h4>
+					<div class='form-floating mb-2'>
+						<input type='text' class='form-control' id='name-input' placeholder='${lang.get("TournamentCreateTournamentName")}'>
+						<label for='name-input' id='name-label'>${lang.get("TournamentCreateTournamentName")}</label>
+						<span class='text-danger' id='name'></span>
+					</div>
+					<div class='form-floating mb-2'>
+						<input type='number' class='form-control' min='2' max='4' value='2' id='nb-players-by-game-input' placeholder='${lang.get("TournamentCreateNbPlayerByGame")}'>
+						<label for='nb-players-by-game-input' id='nb-players-by-game-label'>${lang.get("TournamentCreateNbPlayerByGame")}</label>
+						<span class='text-danger' id='nb_players_by_game'></span>
+					</div>
+					<div class='form-floating mb-2'>
+						<input type='number' class='form-control' min='2' value='4' id='nb-players-input' placeholder='${lang.get("TournamentCreateNbPlayer")}'>
+						<label for='nb-players-input' id='nb-players-label'>${lang.get("TournamentCreateNbPlayer")}</label>
+						<span class='text-danger' id='nb_players'></span>
+					</div>
+					<div class='d-flex'>
+						<button type='button' class='btn btn-primary mt-3 mb-2 mx-2' id='create-button'>${lang.get("TournamentCreateButton")}</button>
+						<span class='text-danger my-auto mx-2' id='detail'></span>
+					</div>
+				</div>
+			</div>
 		`;
 	}
 }