diff --git a/apps/nt-css/package.json b/apps/nt-css/package.json
index db30637..026b3ae 100644
--- a/apps/nt-css/package.json
+++ b/apps/nt-css/package.json
@@ -4,7 +4,7 @@
     "description": "",
     "packageManager": "pnpm@9.0.5",
     "scripts": {
-        "build:css": "pnpm exec postcss src/styles.css -o dist/styles.css",
+        "build:css": "pnpm exec postcss src/styles.scss -o dist/styles.css",
         "publish:css": "pnpm run build:css && npm publish dist/apps/nt-css"
     },
     "engines": {
diff --git a/apps/nt-css/src/base.css b/apps/nt-css/src/base.scss
similarity index 100%
rename from apps/nt-css/src/base.css
rename to apps/nt-css/src/base.scss
diff --git a/apps/nt-css/src/component.css b/apps/nt-css/src/component.scss
similarity index 100%
rename from apps/nt-css/src/component.css
rename to apps/nt-css/src/component.scss
diff --git a/apps/nt-css/src/styles.css b/apps/nt-css/src/styles.scss
similarity index 84%
rename from apps/nt-css/src/styles.css
rename to apps/nt-css/src/styles.scss
index 35d1708..f84b6bd 100644
--- a/apps/nt-css/src/styles.css
+++ b/apps/nt-css/src/styles.scss
@@ -2,9 +2,9 @@
 @import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;600&display=swap');
 
 @import 'tailwindcss/base';
-@import './base.css';
+@import './base.scss';
 
 @import 'tailwindcss/components';
-@import './component.css';
+@import './component.scss';
 
 @import 'tailwindcss/utilities';