diff --git a/components/global/global.css b/components/global/global.css
index e610d8e776a..463efced7b6 100644
--- a/components/global/global.css
+++ b/components/global/global.css
@@ -49,8 +49,6 @@
 }
 
 .font {
-  color: text-color;
-
   /* This is a carefully tested set of fonts, do not touch without consulting with UI designers */
 
   font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
diff --git a/packages/docs/components/example-common.css b/packages/docs/components/example-common.css
index d0151420850..4da55b55187 100644
--- a/packages/docs/components/example-common.css
+++ b/packages/docs/components/example-common.css
@@ -1,4 +1,4 @@
-@value unit, font, font-size, line-height from '../node_modules/@jetbrains/ring-ui/components/global/global.css';
+@value unit, font, font-size, text-color, line-height from '../node_modules/@jetbrains/ring-ui/components/global/global.css';
 
 body {
   margin: unit calc(unit * 4) calc(unit * 2);
@@ -8,7 +8,10 @@ body {
 .body {
   composes: font;
 
+  color: text-color;
+
   font-size: font-size;
+
   line-height: line-height;
 }
 
diff --git a/packages/docs/components/index.css b/packages/docs/components/index.css
index 3e0402b481e..0b835dd8fd5 100644
--- a/packages/docs/components/index.css
+++ b/packages/docs/components/index.css
@@ -15,6 +15,8 @@ body {
 
   min-width: breakpoint-middle;
   min-height: 100vh;
+
+  color: text-color;
 }
 
 .headerItem {