diff --git a/package.json b/package.json
index ea5e3b2a5..5440bd783 100644
--- a/package.json
+++ b/package.json
@@ -20,9 +20,9 @@
     },
     "dependencies": {
         "@appwrite.io/console": "https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@9193",
-        "@appwrite.io/pink": "0.25.0",
         "@appwrite.io/pink-icons": "0.25.0",
         "@appwrite.io/pink-icons-svelte": "1.0.0-next.7",
+        "@appwrite.io/pink-legacy": "^1.0.0",
         "@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@3114ccc",
         "@popperjs/core": "^2.11.8",
         "@sentry/sveltekit": "^8.38.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 4fed4ac14..1ea84dd82 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,15 +11,15 @@ importers:
       '@appwrite.io/console':
         specifier: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@9193
         version: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@9193
-      '@appwrite.io/pink':
-        specifier: 0.25.0
-        version: 0.25.0
       '@appwrite.io/pink-icons':
         specifier: 0.25.0
         version: 0.25.0
       '@appwrite.io/pink-icons-svelte':
         specifier: 1.0.0-next.7
         version: 1.0.0-next.7(svelte@4.2.19)
+      '@appwrite.io/pink-legacy':
+        specifier: ^1.0.0
+        version: 1.0.0
       '@appwrite.io/pink-svelte':
         specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@3114ccc
         version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@3114ccc(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)
@@ -232,6 +232,12 @@ packages:
   '@appwrite.io/pink-icons@0.25.0':
     resolution: {integrity: sha512-0O3i2oEuh5mWvjO80i+X6rbzrWLJ1m5wmv2/M3a1p2PyBJsFxN8xQMTEmTn3Wl/D26SsM7SpzbdW6gmfgoVU9Q==}
 
+  '@appwrite.io/pink-icons@1.0.0':
+    resolution: {integrity: sha512-+zpksP07MvOYwhx9AZDFW0pxXQNC2juKwyOQVRAwAOkN1ACSQKPlyytkI1u2ci6CQPWjJe20CzbvBBuRNXOKjA==}
+
+  '@appwrite.io/pink-legacy@1.0.0':
+    resolution: {integrity: sha512-EZk/wX8oDhIsCXf2A0oQjdNOaHvh5MnWbLQI4pAiGrdy5qQGPoU19AK6iVX6z3QoOq7geoEu0zVwAowBy5hZbQ==}
+
   '@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@3114ccc':
     resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@3114ccc}
     version: 1.0.0-next.85
@@ -239,9 +245,6 @@ packages:
       react-dom: ^18.0.0
       svelte: ^4.0.0
 
-  '@appwrite.io/pink@0.25.0':
-    resolution: {integrity: sha512-9z4G/iAhjvVpM7tkNqzGqrokst4hvNt3Fkf2jD4W6n8j//EJbQ3mJ0I+5dye5Sry0a33wUanq5DSztqFNYq5zw==}
-
   '@babel/code-frame@7.26.2':
     resolution: {integrity: sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==}
     engines: {node: '>=6.9.0'}
@@ -2920,9 +2923,6 @@ packages:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
 
-  normalize.css@8.0.1:
-    resolution: {integrity: sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==}
-
   npm-run-path@4.0.1:
     resolution: {integrity: sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==}
     engines: {node: '>=8'}
@@ -4093,6 +4093,13 @@ snapshots:
 
   '@appwrite.io/pink-icons@0.25.0': {}
 
+  '@appwrite.io/pink-icons@1.0.0': {}
+
+  '@appwrite.io/pink-legacy@1.0.0':
+    dependencies:
+      '@appwrite.io/pink-icons': 1.0.0
+      the-new-css-reset: 1.11.3
+
   '@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@3114ccc(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)':
     dependencies:
       '@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@3114ccc0b95c9d94385c06730b7aeaef7b4a81fc(svelte@4.2.19)
@@ -4105,12 +4112,6 @@ snapshots:
       svelte-motion: 0.12.2(svelte@4.2.19)
       svelte-sonner: 0.3.28(svelte@4.2.19)
 
-  '@appwrite.io/pink@0.25.0':
-    dependencies:
-      '@appwrite.io/pink-icons': 0.25.0
-      normalize.css: 8.0.1
-      the-new-css-reset: 1.11.3
-
   '@babel/code-frame@7.26.2':
     dependencies:
       '@babel/helper-validator-identifier': 7.25.9
@@ -7289,8 +7290,6 @@ snapshots:
 
   normalize-path@3.0.0: {}
 
-  normalize.css@8.0.1: {}
-
   npm-run-path@4.0.1:
     dependencies:
       path-key: 3.1.1
diff --git a/src/lib/components/consent.svelte b/src/lib/components/consent.svelte
index 630cd4efb..322a48ca1 100644
--- a/src/lib/components/consent.svelte
+++ b/src/lib/components/consent.svelte
@@ -122,7 +122,7 @@
 </Modal>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .card {
         position: fixed;
diff --git a/src/lib/components/modalSideCol.svelte b/src/lib/components/modalSideCol.svelte
index 22264001c..ef737433a 100644
--- a/src/lib/components/modalSideCol.svelte
+++ b/src/lib/components/modalSideCol.svelte
@@ -51,7 +51,7 @@
 </ModalWrapper>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/mixins/scroll';
+    @use '@appwrite.io/pink-legacy/src/abstract/mixins/scroll';
 
     .mk-grid {
         overflow: hidden;
diff --git a/src/lib/components/modalWrapper.svelte b/src/lib/components/modalWrapper.svelte
index 4551ff70f..b33bbe204 100644
--- a/src/lib/components/modalWrapper.svelte
+++ b/src/lib/components/modalWrapper.svelte
@@ -84,7 +84,7 @@
 </dialog>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .modal.is-huge {
         block-size: 100%;
diff --git a/src/lib/elements/forms/inputDigits.svelte b/src/lib/elements/forms/inputDigits.svelte
index 6ec6e1ad2..cde8f2c0e 100644
--- a/src/lib/elements/forms/inputDigits.svelte
+++ b/src/lib/elements/forms/inputDigits.svelte
@@ -83,7 +83,7 @@
 </ol>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     /* Default (including mobile) */
     ol {
diff --git a/src/lib/layout/unauthenticated.svelte b/src/lib/layout/unauthenticated.svelte
index 9e457cd27..09c4eaf86 100644
--- a/src/lib/layout/unauthenticated.svelte
+++ b/src/lib/layout/unauthenticated.svelte
@@ -222,7 +222,7 @@
 </main>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .side-bg {
         position: relative;
diff --git a/src/routes/(authenticated)/mfa/+page.svelte b/src/routes/(authenticated)/mfa/+page.svelte
index 35b841124..7505d260f 100644
--- a/src/routes/(authenticated)/mfa/+page.svelte
+++ b/src/routes/(authenticated)/mfa/+page.svelte
@@ -70,7 +70,7 @@
 </Unauthenticated>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .top {
         inset-block-start: 5.85rem;
diff --git a/src/routes/(console)/account/updateMfa.svelte b/src/routes/(console)/account/updateMfa.svelte
index 90004eba6..5de255465 100644
--- a/src/routes/(console)/account/updateMfa.svelte
+++ b/src/routes/(console)/account/updateMfa.svelte
@@ -318,7 +318,7 @@
     factors={$factors} />
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     /* Default (including mobile) */
     .method {
diff --git a/src/routes/(console)/project-[project]/functions/function-[function]/deploymentCard.svelte b/src/routes/(console)/project-[project]/functions/function-[function]/deploymentCard.svelte
index a8a700af2..a87c83a90 100644
--- a/src/routes/(console)/project-[project]/functions/function-[function]/deploymentCard.svelte
+++ b/src/routes/(console)/project-[project]/functions/function-[function]/deploymentCard.svelte
@@ -103,7 +103,7 @@
 </CardGrid>
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .stats-grid-box {
         display: grid;
diff --git a/src/routes/(console)/project-[project]/overview/onboard.svelte b/src/routes/(console)/project-[project]/overview/onboard.svelte
index 677258ccc..ef9f1c021 100644
--- a/src/routes/(console)/project-[project]/overview/onboard.svelte
+++ b/src/routes/(console)/project-[project]/overview/onboard.svelte
@@ -187,7 +187,7 @@
     alt="statistics" />
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .card {
         :global(.theme-dark) & {
diff --git a/src/routes/(public)/auth/oauth2/failure/+page.svelte b/src/routes/(public)/auth/oauth2/failure/+page.svelte
index 811fb1b94..e3c56f811 100644
--- a/src/routes/(public)/auth/oauth2/failure/+page.svelte
+++ b/src/routes/(public)/auth/oauth2/failure/+page.svelte
@@ -42,7 +42,7 @@
 {/await}
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
     // override padding for screens bigger than mobile
     @media #{devices.$break2open} {
         article.card {
diff --git a/src/routes/(public)/auth/oauth2/success/+page.svelte b/src/routes/(public)/auth/oauth2/success/+page.svelte
index 362b80222..69dc8ac41 100644
--- a/src/routes/(public)/auth/oauth2/success/+page.svelte
+++ b/src/routes/(public)/auth/oauth2/success/+page.svelte
@@ -42,7 +42,7 @@
 {/await}
 
 <style lang="scss">
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
     // override padding for screens bigger than mobile
     @media #{devices.$break2open} {
         article.card {
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 0315ae7b7..202618011 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -117,7 +117,7 @@
 </Root>
 
 <style lang="scss" global>
-    @use '@appwrite.io/pink/src/abstract/variables/devices';
+    @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
 
     .tippy-box {
         --p-tooltip-text-color: var(--color-neutral-10);
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index 134ef1e22..20db1d4af 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1,4 +1,4 @@
-import '@appwrite.io/pink';
+import '@appwrite.io/pink-legacy';
 import '@appwrite.io/pink-icons';
 import 'tippy.js/dist/tippy.css';
 import { sdk } from '$lib/stores/sdk';