diff --git a/design/custom_amelia.css b/design/custom_amelia.css
index a219897ff61a9268199b510f891859223037e255..28d3931622c5f21b6762298a720f8a18b7af0ed6 100644
--- a/design/custom_amelia.css
+++ b/design/custom_amelia.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_bootstrap.css b/design/custom_bootstrap.css
index 434b036a42d06a6854a7305f9b1b7c7ca6ffe746..476beedbb76e1d404f9b923636fbe453018d5af3 100644
--- a/design/custom_bootstrap.css
+++ b/design/custom_bootstrap.css
@@ -3575,6 +3575,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_cerulean.css b/design/custom_cerulean.css
index 69456103da9b55f5493d053d7dc7a7f2095c4d03..199947d6085feab832f16c123aa5389377fde8d2 100644
--- a/design/custom_cerulean.css
+++ b/design/custom_cerulean.css
@@ -3547,6 +3547,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_cosmo.css b/design/custom_cosmo.css
index 7c4ca14c8dc424e98933c5f0f461f3e48580ecc2..01575af1d2a7497b48d1573bcf1a9da2603c60ff 100644
--- a/design/custom_cosmo.css
+++ b/design/custom_cosmo.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 42px;
   border-radius: 0;
 }
+.ProfilePhotoSmall {
+  width: 21px;
+  height: 21px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_cyborg.css b/design/custom_cyborg.css
index cd3faaaa39371f4a54a02b1d1d144d92f3a69887..a92abcb22aca18872392d49d5f554c325d0cac29 100644
--- a/design/custom_cyborg.css
+++ b/design/custom_cyborg.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_darkly.css b/design/custom_darkly.css
index 62dec2663e2a38511b60e13d022127cfa0438330..a70de66807d6c892726fef0d80c38918d22bb6b0 100644
--- a/design/custom_darkly.css
+++ b/design/custom_darkly.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 42px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 21px;
+  height: 21px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_flatly.css b/design/custom_flatly.css
index 22004b9271aed1c76474956262a624e1407146c9..a60e74ebd5d63ed0347c371ffff13c6e67a6bb90 100644
--- a/design/custom_flatly.css
+++ b/design/custom_flatly.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 42px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 21px;
+  height: 21px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_journal.css b/design/custom_journal.css
index 16cc671b2ab71ddc6e3aaa6097ab8ba329845de0..d4d805223f8c4daac455ce6131c49f0bf9858ceb 100644
--- a/design/custom_journal.css
+++ b/design/custom_journal.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 42px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 21px;
+  height: 21px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_lumen.css b/design/custom_lumen.css
index 6e6fdfdcd864508ab65605e6234832c996f70728..455eb1cec1f69c6881390096cd48f39057911b0e 100644
--- a/design/custom_lumen.css
+++ b/design/custom_lumen.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 2px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_readable.css b/design/custom_readable.css
index f5b4fe10fe20f74d98761a929c17028201ab681f..587533edd2a01098787ac11eba2f74c0814070e2 100644
--- a/design/custom_readable.css
+++ b/design/custom_readable.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 44px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 22px;
+  height: 22px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_simplex.css b/design/custom_simplex.css
index 760ca9d776e49a272716e1caa018ed4e9a31b8c1..cc596f4b36092d13be471a5947262699b5b9ffe0 100644
--- a/design/custom_simplex.css
+++ b/design/custom_simplex.css
@@ -3547,6 +3547,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_slate.css b/design/custom_slate.css
index b4e4de669db573099059797a15f2258868a23e02..fa7cc426ef19d41b7815ee2021272a4d081c4aed 100644
--- a/design/custom_slate.css
+++ b/design/custom_slate.css
@@ -3559,6 +3559,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_spacelab.css b/design/custom_spacelab.css
index cd5b8f76bd4e99263d49efc729ecf784eb407d02..9c809021e58da15968fcf35d3ef1ce6f1f726b51 100644
--- a/design/custom_spacelab.css
+++ b/design/custom_spacelab.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_superhero.css b/design/custom_superhero.css
index 113075aabe0a9972d760bbee68d40bc610592def..c155d35c177a5f2ef7d94f1c2db02e4cb0a281dc 100644
--- a/design/custom_superhero.css
+++ b/design/custom_superhero.css
@@ -3545,6 +3545,10 @@ button.token-input-delete-token {
   height: 42px;
   border-radius: 0;
 }
+.ProfilePhotoSmall {
+  width: 21px;
+  height: 21px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_united.css b/design/custom_united.css
index 501de0155b8dd2a0f71720f987a148a1f1543c2e..62b1e5285a5ddcc84393b3e8c3d47987b92c31d3 100644
--- a/design/custom_united.css
+++ b/design/custom_united.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/custom_yeti.css b/design/custom_yeti.css
index 72de53ee3d148bfdf9d5068c5ef54cf897870715..501b44d63d164ca569a47396547567f4a88a6090 100644
--- a/design/custom_yeti.css
+++ b/design/custom_yeti.css
@@ -3548,6 +3548,10 @@ button.token-input-delete-token {
   height: 42px;
   border-radius: 0;
 }
+.ProfilePhotoSmall {
+  width: 21px;
+  height: 21px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/design/style.css b/design/style.css
index 18bda548612ae076996c9db427e32af94160aeb9..472e7e96c70e0f08ac0bdb2a4f635328f702a0ad 100644
--- a/design/style.css
+++ b/design/style.css
@@ -3547,6 +3547,10 @@ button.token-input-delete-token {
   height: 40px;
   border-radius: 3px;
 }
+.ProfilePhotoSmall {
+  width: 20px;
+  height: 20px;
+}
 .ProfilePhotoLarge {
   width: 100%;
 }
diff --git a/less/components/avatars.less b/less/components/avatars.less
index 22e5b88bd43fc900ac72f60dd3e0f63074c814b5..1b81dd5ee058b3a3f63d7210c88c7509d59d47f5 100644
--- a/less/components/avatars.less
+++ b/less/components/avatars.less
@@ -11,6 +11,10 @@
   border-radius: @border-radius-small;
 }
 
+.ProfilePhotoSmall {
+  .square(@line-height-computed);
+}
+
 .ProfilePhotoLarge {
   width: 100%;
 }