diff --git a/components/grid/demo/playfround.vue b/components/grid/demo/playfround.vue
index d0950bc21..f1cda41e0 100644
--- a/components/grid/demo/playfround.vue
+++ b/components/grid/demo/playfround.vue
@@ -70,6 +70,7 @@ A simple playground for column count and gutter.
     <pre
       >{{ rowColHtml }}
     </pre>
+    <br />
     <pre
       >{{ rowColHtml }}
     </pre>
@@ -138,4 +139,7 @@ export default defineComponent({
   font-size: 13px;
   padding: 8px 16px;
 }
+[data-theme='dark'] #components-grid-demo-playground pre {
+  background: #2f2f2f;
+}
 </style>
diff --git a/components/steps/demo/step-next.vue b/components/steps/demo/step-next.vue
index eb263f535..9a0e6eb7d 100644
--- a/components/steps/demo/step-next.vue
+++ b/components/steps/demo/step-next.vue
@@ -85,4 +85,9 @@ export default defineComponent({
 .steps-action {
   margin-top: 24px;
 }
+
+[data-theme='dark'] .steps-content {
+  background-color: #2f2f2f;
+  border: 1px dashed #404040;
+}
 </style>