diff --git a/src/app/pages/ui-features/typography/typography.component.html b/src/app/pages/ui-features/typography/typography.component.html
index c471d425e1..30a956c8ac 100644
--- a/src/app/pages/ui-features/typography/typography.component.html
+++ b/src/app/pages/ui-features/typography/typography.component.html
@@ -123,10 +123,10 @@ <h5 class="text-heading">Heading Text</h5>
               Far far away, behind the your awesomeness.
             </div>
           </div>
-          <div class="item text-body">
+          <div class="item text-basic">
             <div class="color bg-body"></div>
             <div>
-              <h5 class="text-body">Body Text</h5>
+              <h5 class="text-basic">Body Text</h5>
               Far far away, behind the your awesomeness.
             </div>
           </div>
diff --git a/src/app/pages/ui-features/typography/typography.component.scss b/src/app/pages/ui-features/typography/typography.component.scss
index d5d295eeef..b58ad29a8c 100644
--- a/src/app/pages/ui-features/typography/typography.component.scss
+++ b/src/app/pages/ui-features/typography/typography.component.scss
@@ -100,6 +100,10 @@
     }
   }
 
+  .text-basic {
+    color: nb-theme(text-basic-color);
+  }
+
   .text-link {
     color: nb-theme(link-text-color);
   }