From dc3eb9081a99abb3ba10c3d9f2f2b15f903a89c2 Mon Sep 17 00:00:00 2001
From: shadcn <m@shadcn.com>
Date: Sat, 21 Feb 2026 15:17:15 +0400
Subject: [PATCH] fix: radius values

---
 apps/v4/styles/globals.css                     | 12 ++++++------
 .../utils/updaters/update-css-vars.test.ts     | 18 +++++++++---------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/apps/v4/styles/globals.css b/apps/v4/styles/globals.css
index d2a128d968..2503cec9e2 100644
--- a/apps/v4/styles/globals.css
+++ b/apps/v4/styles/globals.css
@@ -23,13 +23,13 @@
   --breakpoint-4xl: 2000px;
   --font-sans: var(--font-sans);
   --font-mono: var(--font-mono);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
   --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --radius-2xl: calc(var(--radius) + 8px);
-  --radius-3xl: calc(var(--radius) + 12px);
-  --radius-4xl: calc(var(--radius) + 16px);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --radius-2xl: calc(var(--radius) * 1.8);
+  --radius-3xl: calc(var(--radius) * 2.2);
+  --radius-4xl: calc(var(--radius) * 2.6);
   --color-background: var(--background);
   --color-foreground: var(--foreground);
   --color-card: var(--card);
diff --git a/packages/shadcn/test/utils/updaters/update-css-vars.test.ts b/packages/shadcn/test/utils/updaters/update-css-vars.test.ts
index d2570979d6..edcf5eb156 100644
--- a/packages/shadcn/test/utils/updaters/update-css-vars.test.ts
+++ b/packages/shadcn/test/utils/updaters/update-css-vars.test.ts
@@ -728,13 +728,13 @@ describe("transformCssVarsV4", () => {
       }
 
       @theme inline {
-          --radius-sm: calc(var(--radius) - 4px);
-          --radius-md: calc(var(--radius) - 2px);
+          --radius-sm: calc(var(--radius) * 0.6);
+          --radius-md: calc(var(--radius) * 0.8);
           --radius-lg: var(--radius);
-          --radius-xl: calc(var(--radius) + 4px);
-          --radius-2xl: calc(var(--radius) + 8px);
-          --radius-3xl: calc(var(--radius) + 12px);
-          --radius-4xl: calc(var(--radius) + 16px);
+          --radius-xl: calc(var(--radius) * 1.4);
+          --radius-2xl: calc(var(--radius) * 1.8);
+          --radius-3xl: calc(var(--radius) * 2.2);
+          --radius-4xl: calc(var(--radius) * 2.6);
       }
               "
     `)
@@ -774,9 +774,9 @@ describe("transformCssVarsV4", () => {
               --radius-md: calc(var(--radius) - 2px);
               --radius-lg: var(--radius);
               --radius-xl: calc(var(--radius) + 4px);
-              --radius-2xl: calc(var(--radius) + 8px);
-              --radius-3xl: calc(var(--radius) + 12px);
-              --radius-4xl: calc(var(--radius) + 16px);
+              --radius-2xl: calc(var(--radius) * 1.8);
+              --radius-3xl: calc(var(--radius) * 2.2);
+              --radius-4xl: calc(var(--radius) * 2.6);
             }
               "
     `)