diff --git a/apps/common/main/resources/less/colors-table.less b/apps/common/main/resources/less/colors-table.less
index 4fe462dad..77d7faa05 100644
--- a/apps/common/main/resources/less/colors-table.less
+++ b/apps/common/main/resources/less/colors-table.less
@@ -229,4 +229,6 @@
 
 // Canvas
 // ---------------------------
+@canvas-background: var(--canvas-background);
 @canvas-content-background: var(--canvas-content-background);
+@canvas-page-border: var(--canvas-page-border);
diff --git a/apps/documenteditor/main/resources/less/app.less b/apps/documenteditor/main/resources/less/app.less
index a4f7218cb..d7a520360 100644
--- a/apps/documenteditor/main/resources/less/app.less
+++ b/apps/documenteditor/main/resources/less/app.less
@@ -195,12 +195,16 @@
 
 // Skeleton of document
 
+#editor-container {
+    background-color: @canvas-background;
+}
+
 .doc-placeholder {
-    background: #fbfbfb;
+    background: @canvas-content-background;
     width: 794px;
     margin: 46px auto;
     height: 100%;
-    border: 1px solid #bebebe;
+    border: 1px solid @canvas-page-border;
     padding-top: 50px;
     position: absolute;
     left: 0;
@@ -212,7 +216,7 @@
     > .line {
         height: 15px;
         margin: 30px 80px;
-        background: #e2e2e2;
+        background: fade(#000, 5%);
         overflow: hidden;
         position: relative;
     }