diff --git a/application/menunode.class.inc.php b/application/menunode.class.inc.php
index 3eb86da85..9d89be860 100644
--- a/application/menunode.class.inc.php
+++ b/application/menunode.class.inc.php
@@ -231,6 +231,7 @@ class ApplicationMenu
 			$aMenuGroups[] = [
 				'sId' => $oMenuNode->GetMenuID(),
 				'sIconCssClasses' => $oMenuNode->GetDecorationClasses(),
+				'sInitials' => $oMenuNode->GetInitials(),
 				'sTitle' => $oMenuNode->GetTitle(),
 				'aSubMenuNodes' => static::GetSubMenuNodes($sMenuGroupIdx, $aExtraParams),
 			];
@@ -822,8 +823,8 @@ abstract class MenuNode
  */
 class MenuGroup extends MenuNode
 {
-	/** @var string DEFAULT_DECORATION_CLASSES */
-	const DEFAULT_DECORATION_CLASSES = 'fas fa-ellipsis-v';
+	/** @var string DEFAULT_DECORATION_CLASSES Set to null by default so it is replaced by initials when none is specified */
+	const DEFAULT_DECORATION_CLASSES = null;
 
 	/** @var string The CSS classes used to display the menu group's icon */
 	protected $sDecorationClasses = self::DEFAULT_DECORATION_CLASSES;
@@ -849,6 +850,17 @@ class MenuGroup extends MenuNode
 		}
 	}
 
+	/**
+	 * Return true if the menu group has some decoration classes
+	 *
+	 * @return bool
+	 * @since 3.0.0
+	 */
+	public function HasDecorationClasses()
+	{
+		return (empty($this->GetDecorationClasses()) === false);
+	}
+
 	/**
 	 * Return the CSS classes used for decorating the menu group (typically the icon in the navigation menu)
 	 *
@@ -860,6 +872,17 @@ class MenuGroup extends MenuNode
 		return $this->sDecorationClasses;
 	}
 
+	/**
+	 * Returns the initials of the menu group, used by the rendering in case there is no decoration classes
+	 *
+	 * @return string
+	 * @since 3.0.0
+	 */
+	public function GetInitials()
+	{
+		return mb_substr($this->GetTitle(), 0, 1);
+	}
+
 	/**
 	 * @inheritDoc
 	 */
diff --git a/css/backoffice/layout/_navigation-menu.scss b/css/backoffice/layout/_navigation-menu.scss
index dfd7a7d4c..2485a4f00 100644
--- a/css/backoffice/layout/_navigation-menu.scss
+++ b/css/backoffice/layout/_navigation-menu.scss
@@ -436,7 +436,8 @@ $ibo-navigation-menu--user-info--height--is-expanded: 100%;
 
 .ibo-navigation-menu--menu-group-icon{
 	width: $ibo-navigation-menu--action-icon--width;
-	text-align: center;
+	min-width: $ibo-navigation-menu--action-icon--width; /* Necessary with flex, otherwise it will shrink */
+	justify-content: center;
 	font-size: $ibo-navigation-menu--menu-group-icon--font-size;
 
 	&::before{
@@ -445,7 +446,7 @@ $ibo-navigation-menu--user-info--height--is-expanded: 100%;
 }
 .ibo-navigation-menu--menu-group-title{
 	margin-left: $ibo-navigation-menu--menu-group-title--margin-left;
-	text-align: left;
+	justify-content: left;
 	@extend %ibo-text-truncated-with-ellipsis;
 }
 
diff --git a/templates/layouts/navigation-menu/menu-group.html.twig b/templates/layouts/navigation-menu/menu-group.html.twig
index 7de02fe2b..f4818c79d 100644
--- a/templates/layouts/navigation-menu/menu-group.html.twig
+++ b/templates/layouts/navigation-menu/menu-group.html.twig
@@ -1,4 +1,4 @@
 <a class="ibo-navigation-menu--menu-group" data-role="ibo-navigation-menu--menu-group" data-menu-group-id="{{ aMenuGroup.sId }}" href="#">
-	<span class="ibo-navigation-menu--menu-group-icon fa-fw {{ aMenuGroup.sIconCssClasses }}" data-tooltip-content="{{ aMenuGroup.sTitle }}" data-tooltip-placement="right" data-tooltip-distance-offset="25"></span>
+	<span class="ibo-navigation-menu--menu-group-icon fa-fw {{ aMenuGroup.sIconCssClasses }}" data-tooltip-content="{{ aMenuGroup.sTitle }}" data-tooltip-placement="right" data-tooltip-distance-offset="25">{% if aMenuGroup.sIconCssClasses is empty %}{{ aMenuGroup.sInitials }}{% endif %}</span>
 	<span class="ibo-navigation-menu--menu-group-title">{{ aMenuGroup.sTitle }}</span>
 </a>
\ No newline at end of file