diff --git a/frontend/css/listens-page.less b/frontend/css/listens-page.less
index 8e1c60184b..1fc899e2bf 100644
--- a/frontend/css/listens-page.less
+++ b/frontend/css/listens-page.less
@@ -505,19 +505,6 @@
   }
 }
 
-.ellipsis {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.ellipsis-2-lines {
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
 #spacer {
   margin-top: 54px;
 }
diff --git a/frontend/css/main.less b/frontend/css/main.less
index 3be7d80519..bd7ed49729 100644
--- a/frontend/css/main.less
+++ b/frontend/css/main.less
@@ -42,6 +42,7 @@
 @import "donations.less";
 @import "scroll-container.less";
 @import "flairs.less";
+@import "utilities.less";
 
 @icon-font-path: "/static/fonts/";
 
diff --git a/frontend/css/utilities.less b/frontend/css/utilities.less
new file mode 100644
index 0000000000..34ec212827
--- /dev/null
+++ b/frontend/css/utilities.less
@@ -0,0 +1,20 @@
+.ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.ellipsis-2-lines {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.ellipsis-4-lines {
+  display: -webkit-box;
+  -webkit-line-clamp: 4;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
diff --git a/frontend/js/src/search/PlaylistSearch.tsx b/frontend/js/src/search/PlaylistSearch.tsx
index 2c0d905ab9..79c72b3ce4 100644
--- a/frontend/js/src/search/PlaylistSearch.tsx
+++ b/frontend/js/src/search/PlaylistSearch.tsx
@@ -137,7 +137,13 @@ export default function PlaylistSearch(props: PlayListSearchProps) {
                       {playlist.title}
                     </Link>
                   </td>
-                  <td>{playlist?.annotation}</td>
+                  <td
+                    className="ellipsis-4-lines"
+                    // eslint-disable-next-line react/no-danger
+                    dangerouslySetInnerHTML={{
+                      __html: playlist?.annotation || "",
+                    }}
+                  />
                   <td>
                     <Link
                       to={`https://musicbrainz.org/user/${playlist?.creator}`}