diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..108b8bd
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,22 @@
+{
+    "workbench.colorCustomizations": {
+        "activityBar.activeBackground": "#4e3b40",
+        "activityBar.background": "#4e3b40",
+        "activityBar.foreground": "#e7e7e7",
+        "activityBar.inactiveForeground": "#e7e7e799",
+        "activityBarBadge.background": "#000000",
+        "activityBarBadge.foreground": "#e7e7e7",
+        "commandCenter.border": "#e7e7e799",
+        "sash.hoverBorder": "#4e3b40",
+        "statusBar.background": "#312528",
+        "statusBar.foreground": "#e7e7e7",
+        "statusBarItem.hoverBackground": "#4e3b40",
+        "statusBarItem.remoteBackground": "#312528",
+        "statusBarItem.remoteForeground": "#e7e7e7",
+        "titleBar.activeBackground": "#312528",
+        "titleBar.activeForeground": "#e7e7e7",
+        "titleBar.inactiveBackground": "#31252899",
+        "titleBar.inactiveForeground": "#e7e7e799"
+    },
+    "peacock.color": "#312528"
+}
\ No newline at end of file
diff --git a/app/cuadros.js b/app/cuadros.js
index c07aaeb..0bc737d 100644
--- a/app/cuadros.js
+++ b/app/cuadros.js
@@ -28,7 +28,7 @@ const Cuadrado = ({ valor, alHcerClick }) => {
             onMouseLeave={handleMouseLeave}
         >
             <button
-                className="w-full h-full  text-black  border border-gray-500 text-2xl font-exterabold flex items-center justify-center bg-blue-300 rounded-xl"
+                className="w-full h-full  text-black  border border-gray-500 text-2xl font-exterabold flex items-center border-4 border-black justify-center bg-blue-900 rounded-xl"
                 onClick={() => setShowMenu(true)}
                 disabled={valor !== ''}
             >
diff --git a/app/globals.css b/app/globals.css
index c2ae20f..52b3174 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -9,7 +9,7 @@
 
 @media (prefers-color-scheme: dark) {
   :root {
-    --background:  #ededed;
+    --background:  #ffffff;
     --foreground: #ededed;
   }
 }
diff --git a/app/tablero.js b/app/tablero.js
index 2c0ed0e..1f5bd48 100644
--- a/app/tablero.js
+++ b/app/tablero.js
@@ -1,4 +1,3 @@
-
 'use client'; 
 
 import { useState } from "react";
@@ -21,7 +20,7 @@ const Tablero = () => {
 
     return (
         <>
-            <h1 className="px-5 text-5xl font-extrabold text-white text-center mt-20">Totito</h1> {/* Titulo */}
+            <h1 className="px-5 text-5xl font-extrabold text-black text-center mt-20">Totito</h1> {/* Titulo */}
             <div className="mt-10 p-5 grid grid-cols-3 gap-4 items-center">
                 {
                 cuadros.map((items, indexItem) => (