diff --git a/README.md b/README.md
index 6b78b72..ae96d05 100644
--- a/README.md
+++ b/README.md
@@ -16,4 +16,32 @@ Form + field components for **Astro** with Tailwind utilities and Zod-ready vali
 ```bash
 pnpm add @wrnexus/astro
 # or
-npm i @wrnexus/astro
\ No newline at end of file
+npm i @wrnexus/astro
+```
+
+Theme Use
+
+```bash
+@import "tailwindcss";
+
+@theme {
+    --color-primary: hsl(var(--primary));
+    --color-primary-foreground: hsl(var(--primary-foreground));
+    --color-secondary: hsl(var(--secondary));
+    --color-secondary-foreground: hsl(var(--secondary-foreground));
+    --color-tertiary: hsl(var(--tertiary));
+    --color-tertiary-foreground: hsl(var(--tertiary-foreground));
+    --color-accent: hsl(var(--accent));
+    --color-accent-foreground: hsl(var(--accent-foreground));
+    --color-info: hsl(var(--info));
+    --color-info-foreground: hsl(var(--info-foreground));
+    --color-success: hsl(var(--success));
+    --color-success-foreground: hsl(var(--success-foreground));
+    --color-warning: hsl(var(--warning));
+    --color-warning-foreground: hsl(var(--warning-foreground));
+    --color-danger: hsl(var(--danger));
+    --color-danger-foreground: hsl(var(--danger-foreground));
+    --color-neutral: hsl(var(--neutral));
+    --color-neutral-foreground: hsl(var(--neutral-foreground));
+}
+```
\ No newline at end of file
diff --git a/package.json b/package.json
index 41d3644..b6c6a25 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "components"
   ],
   "sideEffects": false,
+  "style": "./src/styles/style.css",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
diff --git a/src/styles/global.css b/src/styles/global.css
index 400c7dd..c0e64c1 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -4,6 +4,7 @@
 @plugin "@tailwindcss/forms";
 
 @layer base {
+
     button:not(:disabled),
     [role="button"]:not(:disabled) {
         cursor: pointer;
@@ -11,4 +12,24 @@
 }
 
 @custom-variant dark (&:is(.dark *));
-@custom-variant hover (&:hover);
\ No newline at end of file
+@custom-variant hover (&:hover);
+@theme {
+    --color-primary: hsl(var(--primary));
+    --color-primary-foreground: hsl(var(--primary-foreground));
+    --color-secondary: hsl(var(--secondary));
+    --color-secondary-foreground: hsl(var(--secondary-foreground));
+    --color-tertiary: hsl(var(--tertiary));
+    --color-tertiary-foreground: hsl(var(--tertiary-foreground));
+    --color-accent: hsl(var(--accent));
+    --color-accent-foreground: hsl(var(--accent-foreground));
+    --color-info: hsl(var(--info));
+    --color-info-foreground: hsl(var(--info-foreground));
+    --color-success: hsl(var(--success));
+    --color-success-foreground: hsl(var(--success-foreground));
+    --color-warning: hsl(var(--warning));
+    --color-warning-foreground: hsl(var(--warning-foreground));
+    --color-danger: hsl(var(--danger));
+    --color-danger-foreground: hsl(var(--danger-foreground));
+    --color-neutral: hsl(var(--neutral));
+    --color-neutral-foreground: hsl(var(--neutral-foreground));
+}
\ No newline at end of file
diff --git a/src/styles/style.css b/src/styles/style.css
index fc3e948..b415d1c 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -210,25 +210,4 @@
     --danger-foreground: 0 0% 100%;
     --neutral: 215 16% 47%;
     --neutral-foreground: 210 40% 98%;
-}
-
-@theme {
-    --color-primary: hsl(var(--primary));
-    --color-primary-foreground: hsl(var(--primary-foreground));
-    --color-secondary: hsl(var(--secondary));
-    --color-secondary-foreground: hsl(var(--secondary-foreground));
-    --color-tertiary: hsl(var(--tertiary));
-    --color-tertiary-foreground: hsl(var(--tertiary-foreground));
-    --color-accent: hsl(var(--accent));
-    --color-accent-foreground: hsl(var(--accent-foreground));
-    --color-info: hsl(var(--info));
-    --color-info-foreground: hsl(var(--info-foreground));
-    --color-success: hsl(var(--success));
-    --color-success-foreground: hsl(var(--success-foreground));
-    --color-warning: hsl(var(--warning));
-    --color-warning-foreground: hsl(var(--warning-foreground));
-    --color-danger: hsl(var(--danger));
-    --color-danger-foreground: hsl(var(--danger-foreground));
-    --color-neutral: hsl(var(--neutral));
-    --color-neutral-foreground: hsl(var(--neutral-foreground));
 }
\ No newline at end of file