diff --git a/binaries/data/mods/public/art/textures/ui/session/icons/resources/food_small.png b/binaries/data/mods/public/art/textures/ui/session/icons/resources/food_small.png
new file mode 100644
index 0000000000..6f7750ad50
--- /dev/null
+++ b/binaries/data/mods/public/art/textures/ui/session/icons/resources/food_small.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:2ebc98fc7fd2f06cdf944c9be9c5738e9482551c8f76d9a56e520fcfea001052
+size 878
diff --git a/binaries/data/mods/public/art/textures/ui/session/icons/resources/metal_small.png b/binaries/data/mods/public/art/textures/ui/session/icons/resources/metal_small.png
new file mode 100644
index 0000000000..31efff45ec
--- /dev/null
+++ b/binaries/data/mods/public/art/textures/ui/session/icons/resources/metal_small.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:e842b47f9ef4bc81f286012cfe337ad3c1171df54d77a8efece8cbd1640e5f83
+size 756
diff --git a/binaries/data/mods/public/art/textures/ui/session/icons/resources/population_small.png b/binaries/data/mods/public/art/textures/ui/session/icons/resources/population_small.png
new file mode 100644
index 0000000000..bbcf727f17
--- /dev/null
+++ b/binaries/data/mods/public/art/textures/ui/session/icons/resources/population_small.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:0a130d98c0f00a00d712f0a1433abd5eeeb888da9f252bb079476a864d787417
+size 909
diff --git a/binaries/data/mods/public/art/textures/ui/session/icons/resources/stone_small.png b/binaries/data/mods/public/art/textures/ui/session/icons/resources/stone_small.png
new file mode 100644
index 0000000000..8e821737fb
--- /dev/null
+++ b/binaries/data/mods/public/art/textures/ui/session/icons/resources/stone_small.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:f6d440e8caee610d76c281fbfc7f8b9fcff06a3449c6c672de01a1c470779882
+size 772
diff --git a/binaries/data/mods/public/art/textures/ui/session/icons/resources/wood_small.png b/binaries/data/mods/public/art/textures/ui/session/icons/resources/wood_small.png
new file mode 100644
index 0000000000..52522d3d8a
--- /dev/null
+++ b/binaries/data/mods/public/art/textures/ui/session/icons/resources/wood_small.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:8a4bd1cba2f17db72e5b5457d876b77834e3c54a3b03b52d0fccde77d0cb8119
+size 869
diff --git a/binaries/data/mods/public/gui/page_session.xml b/binaries/data/mods/public/gui/page_session.xml
index eaf6a69ba7..be0c721f78 100644
--- a/binaries/data/mods/public/gui/page_session.xml
+++ b/binaries/data/mods/public/gui/page_session.xml
@@ -5,10 +5,11 @@
     <include>common/sprite1.xml</include>
     <include>common/icon_sprites.xml</include>
 
-<include>common/common_sprites.xml</include>
-<include>common/common_styles.xml</include>
+    <include>common/common_sprites.xml</include>
+    <include>common/common_styles.xml</include>
 
     <include>session/sprites.xml</include>
+    <include>session/setup.xml</include>
     <include>session/styles.xml</include>
     <include>session/session.xml</include>
     <include>common/global.xml</include>
diff --git a/binaries/data/mods/public/gui/session/setup.xml b/binaries/data/mods/public/gui/session/setup.xml
new file mode 100644
index 0000000000..10b7d3b38b
--- /dev/null
+++ b/binaries/data/mods/public/gui/session/setup.xml
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<setup>
+	<!-- Icons -->
+	<icon name="iconFood"
+	      sprite="stretched:session/icons/resources/food_small.png"
+	      size="16 16"
+	/>
+	<icon name="iconMetal"
+	      sprite="stretched:session/icons/resources/metal_small.png"
+	      size="16 16"
+	/>
+	<icon name="iconPopulation"
+	      sprite="stretched:session/icons/resources/population_small.png"
+	      size="16 16"
+	/>
+	<icon name="iconStone"
+	      sprite="stretched:session/icons/resources/stone_small.png"
+	      size="16 16"
+	/>
+	<icon name="iconWood"
+	      sprite="stretched:session/icons/resources/wood_small.png"
+	      size="16 16"
+	/>
+</setup>
diff --git a/binaries/data/mods/public/gui/session/utility_functions.js b/binaries/data/mods/public/gui/session/utility_functions.js
index 4bb735e891..4e3c8dab28 100644
--- a/binaries/data/mods/public/gui/session/utility_functions.js
+++ b/binaries/data/mods/public/gui/session/utility_functions.js
@@ -4,11 +4,11 @@ const FAUNA = "fauna";
 const SPECIAL = "special";
 
 const COST_DISPLAY_NAMES = {
-    "food": "Food",
-    "wood": "Wood",
-    "stone": "Stone",
-    "metal": "Metal",
-    "population": "Population"
+    "food": "[icon=\"iconFood\"]",
+    "wood": "[icon=\"iconWood\"]",
+    "stone": "[icon=\"iconStone\"]",
+    "metal": "[icon=\"iconMetal\"]",
+    "population": "[icon=\"iconPopulation\"]"
 };
 
 //-------------------------------- -------------------------------- --------------------------------
@@ -264,11 +264,11 @@ function getCostComponentDisplayName(costComponentName)
 function getEntityCostComponentsTooltipString(template)
 {
 	var costs = [];
-	if (template.cost.food) costs.push(template.cost.food + " [font=\"serif-12\"]" + getCostComponentDisplayName("food") + "[/font]");
-	if (template.cost.wood) costs.push(template.cost.wood + " [font=\"serif-12\"]" + getCostComponentDisplayName("wood") + "[/font]");
-	if (template.cost.metal) costs.push(template.cost.metal + " [font=\"serif-12\"]" + getCostComponentDisplayName("metal") + "[/font]");
-	if (template.cost.stone) costs.push(template.cost.stone + " [font=\"serif-12\"]" + getCostComponentDisplayName("stone") + "[/font]");
-	if (template.cost.population) costs.push(template.cost.population + " [font=\"serif-12\"]" + getCostComponentDisplayName("population") + "[/font]");
+	if (template.cost.food) costs.push("[font=\"serif-12\"]" + getCostComponentDisplayName("food") + "[/font] " + template.cost.food);
+	if (template.cost.wood) costs.push("[font=\"serif-12\"]" + getCostComponentDisplayName("wood") + "[/font] " + template.cost.wood);
+	if (template.cost.metal) costs.push("[font=\"serif-12\"]" + getCostComponentDisplayName("metal") + "[/font] " + template.cost.metal);
+	if (template.cost.stone) costs.push("[font=\"serif-12\"]" + getCostComponentDisplayName("stone") + "[/font] " + template.cost.stone);
+	if (template.cost.population) costs.push("[font=\"serif-12\"]" + getCostComponentDisplayName("population") + "[/font] " + template.cost.population);
 	return costs;
 }
 
@@ -320,7 +320,7 @@ function getWallPieceTooltip(wallTypes)
 			var resourceMin = Math.min.apply(Math, resourceCount[resource]);
 			var resourceMax = Math.max.apply(Math, resourceCount[resource]);
 
-			out.push(resourceMin + " to " + resourceMax + " [font=\"serif-12\"]" + getCostComponentDisplayName(resource) + "[/font]");
+			out.push(getCostComponentDisplayName(resource) + resourceMin + " to " + getCostComponentDisplayName(resource) + resourceMax);
 		}
 	}
 	else
@@ -350,13 +350,13 @@ function getEntityCostTooltip(template)
 		var towerCosts = getEntityCostComponentsTooltipString(templateTower);
 
 		cost += "\n";
-		cost += " Walls:  " + wallCosts.join("; ") + "\n";
-		cost += " Towers: " + towerCosts.join(", ");
+		cost += " Walls:  " + wallCosts.join("  ") + "\n";
+		cost += " Towers: " + towerCosts.join("  ");
 	}
 	else if (template.cost)
 	{
 		var costs = getEntityCostComponentsTooltipString(template);
-		cost += costs.join(", ");
+		cost += costs.join("  ");
 	}
 	else
 	{
@@ -384,9 +384,9 @@ function getNeededResourcesTooltip(resources)
 {
 	var formatted = [];
 	for (var resource in resources)
-		formatted.push(resources[resource] + " [font=\"serif-12\"]" + getCostComponentDisplayName(resource) + "[/font]");
+		formatted.push("[font=\"serif-12\"]" + getCostComponentDisplayName(resource) + "[/font] " + resources[resource]);
 
-	return "\n\n[font=\"serif-bold-13\"][color=\"red\"]Insufficient resources:[/color][/font]\n" + formatted.join(", ");
+	return "\n\n[font=\"serif-bold-13\"][color=\"red\"]Insufficient resources:[/color][/font]\n" + formatted.join("  ");
 }
 
 function getEntitySpeed(template)