diff --git a/WebApp/src/assets.d.ts b/WebApp/src/assets.d.ts
new file mode 100644
index 0000000..4997750
--- /dev/null
+++ b/WebApp/src/assets.d.ts
@@ -0,0 +1 @@
+declare module "*.png";
diff --git a/WebApp/src/assets/bike.png b/WebApp/src/assets/bike.png
new file mode 100644
index 0000000..c84934f
Binary files /dev/null and b/WebApp/src/assets/bike.png differ
diff --git a/WebApp/src/assets/icons/altitude.png b/WebApp/src/assets/icons/altitude.png
new file mode 100644
index 0000000..ae1f982
Binary files /dev/null and b/WebApp/src/assets/icons/altitude.png differ
diff --git a/WebApp/src/assets/icons/ascending-elevation.png b/WebApp/src/assets/icons/ascending-elevation.png
new file mode 100644
index 0000000..6345fe7
Binary files /dev/null and b/WebApp/src/assets/icons/ascending-elevation.png differ
diff --git a/WebApp/src/assets/icons/average.png b/WebApp/src/assets/icons/average.png
new file mode 100644
index 0000000..7c32a5e
Binary files /dev/null and b/WebApp/src/assets/icons/average.png differ
diff --git a/WebApp/src/assets/icons/distance-electricity.png b/WebApp/src/assets/icons/distance-electricity.png
new file mode 100644
index 0000000..89cfa8a
Binary files /dev/null and b/WebApp/src/assets/icons/distance-electricity.png differ
diff --git a/WebApp/src/assets/icons/distance.png b/WebApp/src/assets/icons/distance.png
new file mode 100644
index 0000000..36797ec
Binary files /dev/null and b/WebApp/src/assets/icons/distance.png differ
diff --git a/WebApp/src/assets/icons/electricity.png b/WebApp/src/assets/icons/electricity.png
new file mode 100644
index 0000000..a22b105
Binary files /dev/null and b/WebApp/src/assets/icons/electricity.png differ
diff --git a/WebApp/src/assets/icons/temperature.png b/WebApp/src/assets/icons/temperature.png
new file mode 100644
index 0000000..1496d12
Binary files /dev/null and b/WebApp/src/assets/icons/temperature.png differ
diff --git a/WebApp/src/assets/icons/time.png b/WebApp/src/assets/icons/time.png
new file mode 100644
index 0000000..6d58f5b
Binary files /dev/null and b/WebApp/src/assets/icons/time.png differ
diff --git a/WebApp/src/components/widgets/gauge.tsx b/WebApp/src/components/widgets/gauge.tsx
index b89b2e2..ea2082f 100644
--- a/WebApp/src/components/widgets/gauge.tsx
+++ b/WebApp/src/components/widgets/gauge.tsx
@@ -27,6 +27,7 @@ export class Gauge extends NumericValue {
 		super.onbeforeremove(vnode);
 	}
 	
+	protected mainClassName() { return 'gauge'; }
 	
 	protected graphicalRepresentation(vnode: m.Vnode<{}, {}>): m.Children {
 		return <svg></svg>;
diff --git a/WebApp/src/components/widgets/numeric-value.css b/WebApp/src/components/widgets/numeric-value.css
index 7a0809f..1bb0933 100644
--- a/WebApp/src/components/widgets/numeric-value.css
+++ b/WebApp/src/components/widgets/numeric-value.css
@@ -11,3 +11,27 @@ div.widget span.decimal-value {
 div.widget span.unit {
 	font-size: 1.6rem;
 }
+
+div.widget div.value-icon {
+	display: inline-block;
+	height: 2.3rem;
+	width: 4rem;
+	text-align: center;
+	margin-right: 0.2rem;
+}
+
+div.widget div.value-icon img {
+	display: inline-block;
+	height: 100%;
+	position: relative;
+	top: 0.2rem;
+}
+
+div.numeric-value {
+	padding-left: 0.5rem;
+}
+
+div.numeric-value span.unit {
+	font-size: 1.1rem;
+	margin-left: 0.2rem;
+}
diff --git a/WebApp/src/components/widgets/numeric-value.tsx b/WebApp/src/components/widgets/numeric-value.tsx
index cd5e0df..0c81e24 100644
--- a/WebApp/src/components/widgets/numeric-value.tsx
+++ b/WebApp/src/components/widgets/numeric-value.tsx
@@ -11,6 +11,8 @@ export class NumericValue extends Widget {
 	protected unit: string;
 	protected decimals: number;
 	
+	protected icon?: string;
+	
 	private integralValueElement: HTMLElement;
 	private decimalValueElement: HTMLElement;
 	
@@ -23,16 +25,25 @@ export class NumericValue extends Widget {
 		this.unit = vnode.attrs.unit || '';
 		this.decimals = vnode.attrs.decimals || 0;
 		
+		this.icon = vnode.attrs.icon || null;
+		
 		this.value.onChange(() => this.onValueChange_());
 	}
 	
 	view(vnode: m.Vnode<{}, {}>): m.Children {
-		return <div class="widget gauge" style={'flex: ' + this.widgetWidth}>
-			<p><span class="integral-value"></span><span class="decimal-value"></span><span class="unit">{this.unit}</span></p>
+		return <div class={'widget ' + this.mainClassName()} style={'flex: ' + this.widgetWidth}>
+			<p>
+				{this.icon ? <div class="value-icon"><img src={this.icon}></img></div> : null}
+				<span class="integral-value"></span>
+				<span class="decimal-value"></span>
+				<span class="unit">{this.unit}</span>
+			</p>
 			{this.graphicalRepresentation(vnode)}
 		</div>;
 	}
 	
+	protected mainClassName() { return 'numeric-value'; }
+	
 	protected graphicalRepresentation(vnode: m.Vnode<{}, {}>): m.Children {
 		return [];
 	}
diff --git a/WebApp/src/pages/dashboard/dashboard-page.tsx b/WebApp/src/pages/dashboard/dashboard-page.tsx
index 35fc291..b4dc56a 100644
--- a/WebApp/src/pages/dashboard/dashboard-page.tsx
+++ b/WebApp/src/pages/dashboard/dashboard-page.tsx
@@ -9,6 +9,15 @@ import { GaugeLinear } from 'components/widgets/gauge-linear';
 import { GaugeCircular } from 'components/widgets/gauge-circular';
 import { GaugeBattery } from 'components/widgets/gauge-battery';
 
+import AltitudeIcon from 'assets/icons/altitude.png';
+import AscendingElevationIcon from 'assets/icons/ascending-elevation.png';
+import AverageIcon from 'assets/icons/average.png';
+import DistanceIcon from 'assets/icons/distance.png';
+import ElectricityIcon from 'assets/icons/electricity.png';
+import DistanceElectricityIcon from 'assets/icons/distance-electricity.png';
+import TemperatureIcon from 'assets/icons/temperature.png';
+import TimeIcon from 'assets/icons/time.png';
+
 require('./dashboard-page.css');
 
 export class DashboardPage extends Page {
@@ -67,6 +76,7 @@ export class DashboardPage extends Page {
 	}
 	
 	view() {
+		console.log(DistanceIcon);
 		return this.status
 			? <div class="dashboard-page">
 				<div class="widgets-row">
@@ -80,20 +90,20 @@ export class DashboardPage extends Page {
 				</div>
 				
 				<div class="widgets-row">
-					<NumericValue widgetWidth={0.5} value={this.tripDistance} decimals={1} unit="km" />
+					<NumericValue icon={DistanceIcon} widgetWidth={0.5} value={this.tripDistance} decimals={1} unit="km" />
 				</div>
 				<div class="widgets-row">
-					<NumericValue widgetWidth={0.5} value={this.tripAverageSpeed} decimals={1} unit="km/h" />
-					<NumericValue widgetWidth={0.5} value={this.tripAscendingElevation} decimals={1} unit="m" />
+					<NumericValue icon={AverageIcon} widgetWidth={0.5} value={this.tripAverageSpeed} decimals={1} unit="km/h" />
+					<NumericValue icon={AscendingElevationIcon} widgetWidth={0.5} value={this.tripAscendingElevation} decimals={1} unit="m" />
 				</div>
 				<div class="widgets-row">
-					<NumericValue widgetWidth={0.5} value={this.tripAverageConsumption} decimals={1} unit="Wh/km" />
-					<NumericValue widgetWidth={0.5} value={this.tripEnergy} decimals={1} unit="Wh" />
+					<NumericValue icon={ElectricityIcon} widgetWidth={0.5} value={this.tripAverageConsumption} decimals={1} unit="Wh/km" />
+					<NumericValue icon={DistanceElectricityIcon} widgetWidth={0.5} value={this.tripEnergy} decimals={1} unit="Wh" />
 				</div>
 				
 				<div class="widgets-row">
-					<NumericValue widgetWidth={0.5} value={this.temperature} decimals={1} unit="°C" />
-					<NumericValue widgetWidth={0.5} value={this.altitude} decimals={1} unit="m" />
+					<NumericValue icon={TemperatureIcon} widgetWidth={0.5} value={this.temperature} decimals={1} unit="°C" />
+					<NumericValue icon={AltitudeIcon} widgetWidth={0.5} value={this.altitude} decimals={1} unit="m" />
 				</div>
 			</div>
 			: <p>Chargement...</p>;
diff --git a/WebApp/webpack.config.js b/WebApp/webpack.config.js
index edf69b3..c3a62f9 100644
--- a/WebApp/webpack.config.js
+++ b/WebApp/webpack.config.js
@@ -20,6 +20,10 @@ module.exports = {
         test: /\.css$/i,
         use: [MiniCssExtractPlugin.loader, "css-loader"],
       },
+      {
+        test: /\.(png|jpg|jpeg|gif)$/i,
+        type: "asset/resource",
+      },
     ],
   },
   resolve: {