diff --git a/src/tailwindTheme.ts b/src/tailwindTheme.ts
index 9365dcc..c462574 100644
--- a/src/tailwindTheme.ts
+++ b/src/tailwindTheme.ts
@@ -23,7 +23,10 @@ export const tailwindTheme = {
         border: "hsl(var(--border))",
         input: "hsl(var(--input))",
         ring: "hsl(var(--ring))",
-        background: "hsl(var(--background))",
+        background: {
+          DEFAULT: "hsl(var(--background))",
+          sunk: "hsl(var(--background-sunk))",
+        },
         foreground: "hsl(var(--foreground))",
         primary: {
           DEFAULT: "hsl(var(--primary))",
diff --git a/src/tokens.css b/src/tokens.css
index 3c45289..f4eebe8 100644
--- a/src/tokens.css
+++ b/src/tokens.css
@@ -8,6 +8,7 @@
 
   color-scheme: light;
   --background: 0 0% 100%;
+  --background-sunk: 0 0% 98%;
   --foreground: 0 0% 3.9%;
   --card: 0 0% 100%;
   --card-foreground: 0 0% 3.9%;
@@ -37,6 +38,7 @@
 :root [data-theme="dark"] {
   color-scheme: dark;
   --background: 0 0% 3.9%;
+  --background-sunk: 0 0% 0%;
   --foreground: 0 0% 98%;
   --card: 0 0% 3.9%;
   --card-foreground: 0 0% 98%;