diff --git a/public/less/generics.less b/public/less/generics.less
index 145be82822..254c8fe505 100644
--- a/public/less/generics.less
+++ b/public/less/generics.less
@@ -102,6 +102,12 @@
 		.user-icon-style(24px, 1.5rem);
 	}
 
+	&.avatar-sm2x {
+		width: 48px;
+		height: 48px;
+		.user-icon-style(48px, 1.5rem);
+	}
+
 	&.avatar-md {
 		width: 32px;
 		height: 32px;
diff --git a/public/src/modules/helpers.js b/public/src/modules/helpers.js
index 68584cc51a..943316bfd3 100644
--- a/public/src/modules/helpers.js
+++ b/public/src/modules/helpers.js
@@ -292,7 +292,7 @@
 		classNames = classNames || '';
 
 		// Validate sizes, handle integers, otherwise fall back to `avatar-sm`
-		if (['xs', 'sm', 'md', 'lg', 'xl'].includes(size)) {
+		if (['xs', 'sm', 'sm2x', 'md', 'lg', 'xl'].includes(size)) {
 			classNames += ' avatar-' + size;
 		} else if (!isNaN(parseInt(size, 10))) {
 			styles.push('width: ' + size + 'px;', 'height: ' + size + 'px;', 'line-height: ' + size + 'px;', 'font-size: ' + (parseInt(size, 10) / 16) + 'rem;');