diff --git a/library/ui/src/main/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverter.java b/library/ui/src/main/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverter.java
index 356f44e5b2..f534b9e397 100644
--- a/library/ui/src/main/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverter.java
+++ b/library/ui/src/main/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverter.java
@@ -22,6 +22,7 @@ import android.text.Spanned;
 import android.text.style.BackgroundColorSpan;
 import android.text.style.ForegroundColorSpan;
 import android.text.style.StyleSpan;
+import android.text.style.TypefaceSpan;
 import android.text.style.UnderlineSpan;
 import android.util.SparseArray;
 import androidx.annotation.Nullable;
@@ -131,6 +132,11 @@ import java.util.regex.Pattern;
           HtmlUtils.toCssRgba(colorSpan.getBackgroundColor()));
     } else if (span instanceof HorizontalTextInVerticalContextSpan) {
       return "<span style='text-combine-upright:all;'>";
+    } else if (span instanceof TypefaceSpan) {
+      @Nullable String fontFamily = ((TypefaceSpan) span).getFamily();
+      return fontFamily != null
+          ? Util.formatInvariant("<span style='font-family:\"%s\";'>", fontFamily)
+          : null;
     } else if (span instanceof StyleSpan) {
       switch (((StyleSpan) span).getStyle()) {
         case Typeface.BOLD:
@@ -167,6 +173,9 @@ import java.util.regex.Pattern;
         || span instanceof BackgroundColorSpan
         || span instanceof HorizontalTextInVerticalContextSpan) {
       return "</span>";
+    } else if (span instanceof TypefaceSpan) {
+      @Nullable String fontFamily = ((TypefaceSpan) span).getFamily();
+      return fontFamily != null ? "</span>" : null;
     } else if (span instanceof StyleSpan) {
       switch (((StyleSpan) span).getStyle()) {
         case Typeface.BOLD:
diff --git a/library/ui/src/test/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverterTest.java b/library/ui/src/test/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverterTest.java
index d512c0e43c..b6a6c5a323 100644
--- a/library/ui/src/test/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverterTest.java
+++ b/library/ui/src/test/java/com/google/android/exoplayer2/ui/SpannedToHtmlConverterTest.java
@@ -25,6 +25,7 @@ import android.text.Spanned;
 import android.text.style.BackgroundColorSpan;
 import android.text.style.ForegroundColorSpan;
 import android.text.style.StyleSpan;
+import android.text.style.TypefaceSpan;
 import android.text.style.UnderlineSpan;
 import androidx.test.ext.junit.runners.AndroidJUnit4;
 import com.google.android.exoplayer2.text.span.HorizontalTextInVerticalContextSpan;
@@ -85,6 +86,37 @@ public class SpannedToHtmlConverterTest {
                 + "horizontal numbers");
   }
 
+  @Test
+  public void convert_supportsTypefaceSpan() {
+    SpannableString spanned = new SpannableString("String with Times New Roman section");
+    spanned.setSpan(
+        new TypefaceSpan(/* family= */ "Times New Roman"),
+        "String with ".length(),
+        "String with Times New Roman".length(),
+        Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
+
+    String html = SpannedToHtmlConverter.convert(spanned);
+
+    assertThat(html)
+        .isEqualTo(
+            "String with <span style='font-family:\"Times New Roman\";'>Times New Roman</span>"
+                + " section");
+  }
+
+  @Test
+  public void convert_supportsTypefaceSpan_nullFamily() {
+    SpannableString spanned = new SpannableString("String with unstyled section");
+    spanned.setSpan(
+        new TypefaceSpan(/* family= */ (String) null),
+        "String with ".length(),
+        "String with unstyled".length(),
+        Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
+
+    String html = SpannedToHtmlConverter.convert(spanned);
+
+    assertThat(html).isEqualTo("String with unstyled section");
+  }
+
   @Test
   public void convert_supportsStyleSpan() {
     SpannableString spanned =