diff --git a/webui/src/web-components/demo/sketch-push-button.demo.ts b/webui/src/web-components/demo/sketch-push-button.demo.ts
index f7b83fd..4405a9e 100644
--- a/webui/src/web-components/demo/sketch-push-button.demo.ts
+++ b/webui/src/web-components/demo/sketch-push-button.demo.ts
@@ -12,18 +12,20 @@
   render() {
     return html`
       <div
-        class="p-4 bg-white rounded-lg shadow-sm border border-gray-200 max-w-md mx-auto"
+        class="p-4 bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 max-w-md mx-auto"
       >
-        <h2 class="text-lg font-semibold mb-4">Push Button Demo</h2>
+        <h2 class="text-lg font-semibold mb-4 text-gray-900 dark:text-gray-100">
+          Push Button Demo
+        </h2>
 
         <div class="mb-4">
-          <p class="text-sm text-gray-600 mb-2">
+          <p class="text-sm text-gray-600 dark:text-gray-300 mb-2">
             Test the push button component:
           </p>
           <sketch-push-button></sketch-push-button>
         </div>
 
-        <div class="text-xs text-gray-500">
+        <div class="text-xs text-gray-500 dark:text-gray-400">
           <p>Click the push button to test:</p>
           <ul class="list-disc list-inside mt-1">
             <li>Modal opens with git information</li>