standby-design-mcp 0.1.3 → 0.1.5

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2026 Karsten Kreh
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2026 Karsten Kreh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/http.js

@@ -2091,6 +2091,7 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     ...brandContrastWarnLight,
     ["primary-subtle", "brand", 100],
     ["primary-subtle-foreground", "brand", 950],
+    ["primary-emphasis", "brand", 700],
     [null, null, "Secondary \u2014 softened brand"],
     ["secondary", "brand", 200],
     ["secondary-foreground", "brand", fgStep(brandMap[200]?.hex, brandMap, 100, 900, fgMode)],
@@ -2105,6 +2106,7 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     destFgLight,
     ["destructive-subtle", "error", 100],
     ["destructive-subtle-foreground", "error", 950],
+    ["destructive-emphasis", "error", 700],
     ["destructive-border", "error-surface", 300],
     [null, null, "Border / Input / Ring"],
     ["border", "surface", 300],
@@ -2137,6 +2139,7 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     ...brandContrastWarnDark,
     ["primary-subtle", "brand", 850],
     ["primary-subtle-foreground", "brand", 50],
+    ["primary-emphasis", "brand", 300],
     [null, null, "Secondary \u2014 softened brand"],
     ["secondary", "brand", 800],
     ["secondary-foreground", "brand", fgStep(brandMap[800]?.hex, brandMap, 100, 900, fgMode)],
@@ -2144,26 +2147,27 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     ["muted", "surface", 850],
     ["muted-foreground", "surface", 300],
     [null, null, "Accent"],
-    ["accent", "brand", 800],
-    ["accent-foreground", "brand", fgStep(brandMap[800]?.hex, brandMap, 50, 950, fgMode)],
+    ["accent", "brand", 850],
+    ["accent-foreground", "brand", fgStep(brandMap[850]?.hex, brandMap, 50, 950, fgMode)],
     [null, null, "Destructive"],
     destDark,
     destFgDark,
     ["destructive-subtle", "error", 850],
     ["destructive-subtle-foreground", "error", 50],
+    ["destructive-emphasis", "error", 300],
     ["destructive-border", "error-surface", 700],
     [null, null, "Border / Input / Ring"],
     ["border", "surface", 600],
     ["border-muted", "surface", 700],
-    ["input", "surface", 700],
+    ["input", "surface", 600],
     ["ring", "surface", 500],
     [null, null, "Sidebar"],
-    ["sidebar", "surface", 875],
+    ["sidebar", "surface", 825],
     ["sidebar-foreground", "surface", 25],
     sbPrimDark,
     sbPrimFgDark,
-    ["sidebar-accent", "brand", 800],
-    ["sidebar-accent-foreground", "brand", fgStep(brandMap[800]?.hex, brandMap, 50, 950, fgMode)],
+    ["sidebar-accent", "brand", 850],
+    ["sidebar-accent-foreground", "brand", fgStep(brandMap[850]?.hex, brandMap, 50, 950, fgMode)],
     ["sidebar-border", "surface", 600],
     ["sidebar-ring", "surface", 500]
   ]);
@@ -2196,14 +2200,15 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
       [`${n}-popover-foreground`, `${n}-surface`, 975],
       [null, null, "Secondary"],
       [`${n}-secondary`, n, 200],
-      [`${n}-secondary-foreground`, n, 900],
+      [`${n}-secondary-foreground`, n, fgStep(aMap[200]?.hex, aMap, 100, 900, fgMode)],
       [null, null, "Muted / Subtle / Accent"],
       [`${n}-muted`, `${n}-surface`, 75],
       [`${n}-muted-foreground`, `${n}-surface`, 700],
       [`${n}-accent`, n, 100],
-      [`${n}-accent-foreground`, n, 950],
+      [`${n}-accent-foreground`, n, fgStep(aMap[100]?.hex, aMap, 50, 950, fgMode)],
       [`${n}-subtle`, n, 100],
       [`${n}-subtle-foreground`, n, 950],
+      [`${n}-emphasis`, n, 700],
       [null, null, "Border / Input / Ring"],
       [`${n}-border`, `${n}-surface`, 300],
       [`${n}-border-muted`, `${n}-surface`, 200],
@@ -2223,18 +2228,19 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
       [`${n}-popover-foreground`, `${n}-surface`, 25],
       [null, null, "Secondary"],
       [`${n}-secondary`, n, 800],
-      [`${n}-secondary-foreground`, n, 100],
+      [`${n}-secondary-foreground`, n, fgStep(aMap[800]?.hex, aMap, 100, 900, fgMode)],
       [null, null, "Muted / Subtle / Accent"],
       [`${n}-muted`, `${n}-surface`, 850],
       [`${n}-muted-foreground`, `${n}-surface`, 300],
-      [`${n}-accent`, n, 800],
-      [`${n}-accent-foreground`, n, 50],
+      [`${n}-accent`, n, 850],
+      [`${n}-accent-foreground`, n, fgStep(aMap[850]?.hex, aMap, 50, 950, fgMode)],
       [`${n}-subtle`, n, 850],
       [`${n}-subtle-foreground`, n, 50],
+      [`${n}-emphasis`, n, 300],
       [null, null, "Border / Input / Ring"],
-      [`${n}-border`, `${n}-surface`, 700],
+      [`${n}-border`, `${n}-surface`, 600],
       [`${n}-border-muted`, `${n}-surface`, 700],
-      [`${n}-input`, `${n}-surface`, 700],
+      [`${n}-input`, `${n}-surface`, 600],
       [`${n}-ring`, `${n}-surface`, 500]
     ]);
     accentBlocks += `
@@ -2260,7 +2266,7 @@ function generateLlmBriefing(brandHex, effectiveBgHex, effectiveErrorHex, accent
     )
   ].join("\n");
   const pinnedNote = brandPin || errorPin || accentPalettes.some((a) => a.pin) ? `
-> **Pinned** means the exact input hex is used for primary/destructive button colors instead of the generated palette step (brand-600/400 or error-600/400).
+> **Pinned** means the exact input hex is used instead of the generated palette step \u2014 for the primary (\`brand-600/400\`), destructive (\`error-600/400\`), or accent (\`{accent}-600/400\`) role of that color.
 ` : "";
   let pinnedContrastWarning = "";
   if (brandPin) {
@@ -2288,41 +2294,44 @@ ${pinnedNote}${pinnedContrastWarning}
 | \`--popover\` | surface-25 | surface-800 | Popover/dropdown |
 | \`--primary\` | brand-600 | brand-400 | Primary buttons, links |
 | \`--primary-subtle\` | brand-100 | brand-850 | Tinted brand fills: callouts, selected items |
+| \`--primary-emphasis\` | brand-700 | brand-300 | Brand-colored text, links, icons on background |
 | \`--secondary\` | brand-200 | brand-800 | Secondary buttons |
 | \`--muted\` | surface-75 | surface-850 | Muted backgrounds |
-| \`--accent\` | brand-100 | brand-800 | Interaction highlights (hover, selected) |
+| \`--accent\` | brand-100 | brand-850 | Interaction highlights (hover, selected) |
 | \`--destructive\` | error-600 | error-400 | Error/delete actions |
 | \`--destructive-subtle\` | error-100 | error-850 | Inline errors, alert backgrounds |
+| \`--destructive-emphasis\` | error-700 | error-300 | Error text and icons on background |
 | \`--destructive-border\` | error-surface-300 | error-surface-700 | Error borders |
 | \`--border\` | surface-300 | surface-600 | Default borders |
 | \`--border-muted\` | surface-200 | surface-700 | Subtle separators |
-| \`--input\` | surface-300 | surface-700 | Form-control borders (input, select, textarea) |
+| \`--input\` | surface-300 | surface-600 | Form-control borders (input, select, textarea) |
 | \`--ring\` | surface-400 | surface-500 | Focus rings |
 
 ### Sidebar
 
 | Token | Light | Dark |
 |-------|-------|------|
-| \`--sidebar\` | surface-25 | surface-875 |
+| \`--sidebar\` | surface-25 | surface-825 |
 | \`--sidebar-primary\` | brand-600 | brand-400 |
-| \`--sidebar-accent\` | brand-100 | brand-800 |
+| \`--sidebar-accent\` | brand-100 | brand-850 |
 | \`--sidebar-border\` | surface-300 | surface-600 |
+| \`--sidebar-ring\` | surface-400 | surface-500 |
 
 Every background token has a matching \`*-foreground\` counterpart. Always pair them.
 ${accentPalettes.length > 0 ? `
 ### Accent Scopes
 
 Each accent color provides a full semantic scope:
-${accentPalettes.map((a) => `- **${a.name}** (\`--${a.cssName}\`): \`-foreground\`, \`-background\`, \`-card\`, \`-popover\`, \`-secondary\`, \`-muted\`, \`-accent\`, \`-subtle\`, \`-border\`, \`-border-muted\`, \`-input\`, \`-ring\` \u2014 each with light/dark variants.`).join("\n")}
+${accentPalettes.map((a) => `- **${a.name}** (\`--${a.cssName}\`): \`-foreground\`, \`-background\`, \`-card\`, \`-popover\`, \`-secondary\`, \`-muted\`, \`-accent\`, \`-subtle\`, \`-emphasis\`, \`-border\`, \`-border-muted\`, \`-input\`, \`-ring\` \u2014 each with light/dark variants.`).join("\n")}
 ` : ""}
 ## How to Use
 
 1. **Use semantic tokens** (\`--primary\`, \`--background\`, etc.) in component code \u2014 never reference primitive step numbers directly.
-2. **Tailwind**: All tokens are available as Tailwind utilities (\`bg-primary\`, \`text-foreground\`, \`border-border\`, etc.).
+2. **Tailwind v4**: The export ships plain CSS custom properties. To get utilities like \`bg-primary\` or \`text-foreground\`, map the variables once via \`@theme inline { --color-primary: var(--primary); \u2026 }\` \u2014 see tailwindcss.com/docs/theme.
 3. **Dark mode**: Add \`.dark\` to \`<html>\` or a container. All semantic tokens remap automatically.
 4. **Borders**: Default to \`--border-muted\` for subtle separation (dividers, table rows). Use \`--border\` for visible borders (cards, panels). Form controls (\`input\`, \`select\`, \`textarea\`) always use \`--input\` \u2014 never \`--border\`.
-5. **Shadows and radii**: see standby.design/shape for hue-matched shadow tokens and border-radius scales.
-6. **Border-radius**: Base \`--radius: 0.625rem\`. Derived sizes: \`--radius-sm\` (0.6\xD7) through \`--radius-4xl\` (2.6\xD7).
+5. **Colored text**: For links, icons, and indicators placed directly on \`--background\` or \`--card\`, use \`--primary-emphasis\` / \`--destructive-emphasis\` / \`--{name}-emphasis\` \u2014 never the button colors (\`--primary\`, 600/400 steps), which may lack text contrast there.
+6. **Shadows and radii**: see standby.design/shape for hue-matched shadow tokens and border-radius scales.
 
 ## Primitive Scale Reference
 
@@ -2332,10 +2341,13 @@ Each color uses an 18-step scale: **25, 50, 75, 100, 200\u2013800, 825, 850, 875
 - **200\u2013800** \u2014 core palette (buttons, text, accents)
 - **825\u2013875** \u2014 dark-mode surfaces
 - **900\u2013975** \u2014 high-contrast surfaces
+- **0 / 1000** \u2014 neutral only: pure white and pure black endpoints (\`--color-neutral-0\`, \`--color-neutral-1000\`)
 
-Two variants per color:
+Chroma variants:
 - \`--color-{name}-{step}\` \u2014 full chroma (interactive elements)
-- \`--color-{name}-surface-{step}\` \u2014 ${pct}% chroma (backgrounds, containers)
+- \`--color-surface-{step}\` \u2014 the brand's ${pct}%-chroma counterpart (backgrounds, containers)
+- \`--color-error-surface-{step}\` and \`--color-{accent}-surface-{step}\` \u2014 reduced-chroma twins for error and extra accents
+- \`--color-neutral-{step}\` \u2014 0% chroma, no surface twin
 
 ## Settings
 
@@ -3454,7 +3466,7 @@ ${output}`);
 }
 
 // src/server.ts
-var SERVER_VERSION = "0.1.3";
+var SERVER_VERSION = "0.1.5";
 function createServer() {
   const server = new McpServer(
     { name: "standby-design", version: SERVER_VERSION },

package/dist/index.js

@@ -2090,6 +2090,7 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     ...brandContrastWarnLight,
     ["primary-subtle", "brand", 100],
     ["primary-subtle-foreground", "brand", 950],
+    ["primary-emphasis", "brand", 700],
     [null, null, "Secondary \u2014 softened brand"],
     ["secondary", "brand", 200],
     ["secondary-foreground", "brand", fgStep(brandMap[200]?.hex, brandMap, 100, 900, fgMode)],
@@ -2104,6 +2105,7 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     destFgLight,
     ["destructive-subtle", "error", 100],
     ["destructive-subtle-foreground", "error", 950],
+    ["destructive-emphasis", "error", 700],
     ["destructive-border", "error-surface", 300],
     [null, null, "Border / Input / Ring"],
     ["border", "surface", 300],
@@ -2136,6 +2138,7 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     ...brandContrastWarnDark,
     ["primary-subtle", "brand", 850],
     ["primary-subtle-foreground", "brand", 50],
+    ["primary-emphasis", "brand", 300],
     [null, null, "Secondary \u2014 softened brand"],
     ["secondary", "brand", 800],
     ["secondary-foreground", "brand", fgStep(brandMap[800]?.hex, brandMap, 100, 900, fgMode)],
@@ -2143,26 +2146,27 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
     ["muted", "surface", 850],
     ["muted-foreground", "surface", 300],
     [null, null, "Accent"],
-    ["accent", "brand", 800],
-    ["accent-foreground", "brand", fgStep(brandMap[800]?.hex, brandMap, 50, 950, fgMode)],
+    ["accent", "brand", 850],
+    ["accent-foreground", "brand", fgStep(brandMap[850]?.hex, brandMap, 50, 950, fgMode)],
     [null, null, "Destructive"],
     destDark,
     destFgDark,
     ["destructive-subtle", "error", 850],
     ["destructive-subtle-foreground", "error", 50],
+    ["destructive-emphasis", "error", 300],
     ["destructive-border", "error-surface", 700],
     [null, null, "Border / Input / Ring"],
     ["border", "surface", 600],
     ["border-muted", "surface", 700],
-    ["input", "surface", 700],
+    ["input", "surface", 600],
     ["ring", "surface", 500],
     [null, null, "Sidebar"],
-    ["sidebar", "surface", 875],
+    ["sidebar", "surface", 825],
     ["sidebar-foreground", "surface", 25],
     sbPrimDark,
     sbPrimFgDark,
-    ["sidebar-accent", "brand", 800],
-    ["sidebar-accent-foreground", "brand", fgStep(brandMap[800]?.hex, brandMap, 50, 950, fgMode)],
+    ["sidebar-accent", "brand", 850],
+    ["sidebar-accent-foreground", "brand", fgStep(brandMap[850]?.hex, brandMap, 50, 950, fgMode)],
     ["sidebar-border", "surface", 600],
     ["sidebar-ring", "surface", 500]
   ]);
@@ -2195,14 +2199,15 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
       [`${n}-popover-foreground`, `${n}-surface`, 975],
       [null, null, "Secondary"],
       [`${n}-secondary`, n, 200],
-      [`${n}-secondary-foreground`, n, 900],
+      [`${n}-secondary-foreground`, n, fgStep(aMap[200]?.hex, aMap, 100, 900, fgMode)],
       [null, null, "Muted / Subtle / Accent"],
       [`${n}-muted`, `${n}-surface`, 75],
       [`${n}-muted-foreground`, `${n}-surface`, 700],
       [`${n}-accent`, n, 100],
-      [`${n}-accent-foreground`, n, 950],
+      [`${n}-accent-foreground`, n, fgStep(aMap[100]?.hex, aMap, 50, 950, fgMode)],
       [`${n}-subtle`, n, 100],
       [`${n}-subtle-foreground`, n, 950],
+      [`${n}-emphasis`, n, 700],
       [null, null, "Border / Input / Ring"],
       [`${n}-border`, `${n}-surface`, 300],
       [`${n}-border-muted`, `${n}-surface`, 200],
@@ -2222,18 +2227,19 @@ function generateSemantic(accentPalettes, brandPal, errPal, errSurfPal, surfaceP
       [`${n}-popover-foreground`, `${n}-surface`, 25],
       [null, null, "Secondary"],
       [`${n}-secondary`, n, 800],
-      [`${n}-secondary-foreground`, n, 100],
+      [`${n}-secondary-foreground`, n, fgStep(aMap[800]?.hex, aMap, 100, 900, fgMode)],
       [null, null, "Muted / Subtle / Accent"],
       [`${n}-muted`, `${n}-surface`, 850],
       [`${n}-muted-foreground`, `${n}-surface`, 300],
-      [`${n}-accent`, n, 800],
-      [`${n}-accent-foreground`, n, 50],
+      [`${n}-accent`, n, 850],
+      [`${n}-accent-foreground`, n, fgStep(aMap[850]?.hex, aMap, 50, 950, fgMode)],
       [`${n}-subtle`, n, 850],
       [`${n}-subtle-foreground`, n, 50],
+      [`${n}-emphasis`, n, 300],
       [null, null, "Border / Input / Ring"],
-      [`${n}-border`, `${n}-surface`, 700],
+      [`${n}-border`, `${n}-surface`, 600],
       [`${n}-border-muted`, `${n}-surface`, 700],
-      [`${n}-input`, `${n}-surface`, 700],
+      [`${n}-input`, `${n}-surface`, 600],
       [`${n}-ring`, `${n}-surface`, 500]
     ]);
     accentBlocks += `
@@ -2259,7 +2265,7 @@ function generateLlmBriefing(brandHex, effectiveBgHex, effectiveErrorHex, accent
     )
   ].join("\n");
   const pinnedNote = brandPin || errorPin || accentPalettes.some((a) => a.pin) ? `
-> **Pinned** means the exact input hex is used for primary/destructive button colors instead of the generated palette step (brand-600/400 or error-600/400).
+> **Pinned** means the exact input hex is used instead of the generated palette step \u2014 for the primary (\`brand-600/400\`), destructive (\`error-600/400\`), or accent (\`{accent}-600/400\`) role of that color.
 ` : "";
   let pinnedContrastWarning = "";
   if (brandPin) {
@@ -2287,41 +2293,44 @@ ${pinnedNote}${pinnedContrastWarning}
 | \`--popover\` | surface-25 | surface-800 | Popover/dropdown |
 | \`--primary\` | brand-600 | brand-400 | Primary buttons, links |
 | \`--primary-subtle\` | brand-100 | brand-850 | Tinted brand fills: callouts, selected items |
+| \`--primary-emphasis\` | brand-700 | brand-300 | Brand-colored text, links, icons on background |
 | \`--secondary\` | brand-200 | brand-800 | Secondary buttons |
 | \`--muted\` | surface-75 | surface-850 | Muted backgrounds |
-| \`--accent\` | brand-100 | brand-800 | Interaction highlights (hover, selected) |
+| \`--accent\` | brand-100 | brand-850 | Interaction highlights (hover, selected) |
 | \`--destructive\` | error-600 | error-400 | Error/delete actions |
 | \`--destructive-subtle\` | error-100 | error-850 | Inline errors, alert backgrounds |
+| \`--destructive-emphasis\` | error-700 | error-300 | Error text and icons on background |
 | \`--destructive-border\` | error-surface-300 | error-surface-700 | Error borders |
 | \`--border\` | surface-300 | surface-600 | Default borders |
 | \`--border-muted\` | surface-200 | surface-700 | Subtle separators |
-| \`--input\` | surface-300 | surface-700 | Form-control borders (input, select, textarea) |
+| \`--input\` | surface-300 | surface-600 | Form-control borders (input, select, textarea) |
 | \`--ring\` | surface-400 | surface-500 | Focus rings |
 
 ### Sidebar
 
 | Token | Light | Dark |
 |-------|-------|------|
-| \`--sidebar\` | surface-25 | surface-875 |
+| \`--sidebar\` | surface-25 | surface-825 |
 | \`--sidebar-primary\` | brand-600 | brand-400 |
-| \`--sidebar-accent\` | brand-100 | brand-800 |
+| \`--sidebar-accent\` | brand-100 | brand-850 |
 | \`--sidebar-border\` | surface-300 | surface-600 |
+| \`--sidebar-ring\` | surface-400 | surface-500 |
 
 Every background token has a matching \`*-foreground\` counterpart. Always pair them.
 ${accentPalettes.length > 0 ? `
 ### Accent Scopes
 
 Each accent color provides a full semantic scope:
-${accentPalettes.map((a) => `- **${a.name}** (\`--${a.cssName}\`): \`-foreground\`, \`-background\`, \`-card\`, \`-popover\`, \`-secondary\`, \`-muted\`, \`-accent\`, \`-subtle\`, \`-border\`, \`-border-muted\`, \`-input\`, \`-ring\` \u2014 each with light/dark variants.`).join("\n")}
+${accentPalettes.map((a) => `- **${a.name}** (\`--${a.cssName}\`): \`-foreground\`, \`-background\`, \`-card\`, \`-popover\`, \`-secondary\`, \`-muted\`, \`-accent\`, \`-subtle\`, \`-emphasis\`, \`-border\`, \`-border-muted\`, \`-input\`, \`-ring\` \u2014 each with light/dark variants.`).join("\n")}
 ` : ""}
 ## How to Use
 
 1. **Use semantic tokens** (\`--primary\`, \`--background\`, etc.) in component code \u2014 never reference primitive step numbers directly.
-2. **Tailwind**: All tokens are available as Tailwind utilities (\`bg-primary\`, \`text-foreground\`, \`border-border\`, etc.).
+2. **Tailwind v4**: The export ships plain CSS custom properties. To get utilities like \`bg-primary\` or \`text-foreground\`, map the variables once via \`@theme inline { --color-primary: var(--primary); \u2026 }\` \u2014 see tailwindcss.com/docs/theme.
 3. **Dark mode**: Add \`.dark\` to \`<html>\` or a container. All semantic tokens remap automatically.
 4. **Borders**: Default to \`--border-muted\` for subtle separation (dividers, table rows). Use \`--border\` for visible borders (cards, panels). Form controls (\`input\`, \`select\`, \`textarea\`) always use \`--input\` \u2014 never \`--border\`.
-5. **Shadows and radii**: see standby.design/shape for hue-matched shadow tokens and border-radius scales.
-6. **Border-radius**: Base \`--radius: 0.625rem\`. Derived sizes: \`--radius-sm\` (0.6\xD7) through \`--radius-4xl\` (2.6\xD7).
+5. **Colored text**: For links, icons, and indicators placed directly on \`--background\` or \`--card\`, use \`--primary-emphasis\` / \`--destructive-emphasis\` / \`--{name}-emphasis\` \u2014 never the button colors (\`--primary\`, 600/400 steps), which may lack text contrast there.
+6. **Shadows and radii**: see standby.design/shape for hue-matched shadow tokens and border-radius scales.
 
 ## Primitive Scale Reference
 
@@ -2331,10 +2340,13 @@ Each color uses an 18-step scale: **25, 50, 75, 100, 200\u2013800, 825, 850, 875
 - **200\u2013800** \u2014 core palette (buttons, text, accents)
 - **825\u2013875** \u2014 dark-mode surfaces
 - **900\u2013975** \u2014 high-contrast surfaces
+- **0 / 1000** \u2014 neutral only: pure white and pure black endpoints (\`--color-neutral-0\`, \`--color-neutral-1000\`)
 
-Two variants per color:
+Chroma variants:
 - \`--color-{name}-{step}\` \u2014 full chroma (interactive elements)
-- \`--color-{name}-surface-{step}\` \u2014 ${pct}% chroma (backgrounds, containers)
+- \`--color-surface-{step}\` \u2014 the brand's ${pct}%-chroma counterpart (backgrounds, containers)
+- \`--color-error-surface-{step}\` and \`--color-{accent}-surface-{step}\` \u2014 reduced-chroma twins for error and extra accents
+- \`--color-neutral-{step}\` \u2014 0% chroma, no surface twin
 
 ## Settings
 
@@ -3453,7 +3465,7 @@ ${output}`);
 }
 
 // src/server.ts
-var SERVER_VERSION = "0.1.3";
+var SERVER_VERSION = "0.1.5";
 function createServer() {
   const server2 = new McpServer(
     { name: "standby-design", version: SERVER_VERSION },

package/package.json

@@ -1,53 +1,53 @@
-{
-  "name": "standby-design-mcp",
-  "version": "0.1.3",
-  "mcpName": "io.github.KarstenKreh/standby-design-mcp",
-  "description": "MCP server for standby.design — generate production-ready design systems (OKLCH color palettes, fluid type scales, spacing & layout, shape and icon tokens) and export them as CSS, Tailwind v4, or W3C design tokens. Every result links back to the standby.design web UI for visual fine-tuning.",
-  "license": "MIT",
-  "type": "module",
-  "homepage": "https://standby.design",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/KarstenKreh/Standby.Design.git",
-    "directory": "packages/mcp-server"
-  },
-  "bugs": {
-    "url": "https://github.com/KarstenKreh/Standby.Design/issues"
-  },
-  "bin": {
-    "standby-design-mcp": "./dist/index.js"
-  },
-  "files": [
-    "dist"
-  ],
-  "engines": {
-    "node": ">=18"
-  },
-  "scripts": {
-    "build": "node build.mjs",
-    "prepublishOnly": "node build.mjs && node smoke.mjs",
-    "typecheck": "tsc --noEmit",
-    "smoke": "node smoke.mjs",
-    "start": "node dist/index.js"
-  },
-  "keywords": [
-    "mcp",
-    "model-context-protocol",
-    "design-system",
-    "design-tokens",
-    "color-palette",
-    "oklch",
-    "typography",
-    "tailwind",
-    "shadcn"
-  ],
-  "dependencies": {
-    "@modelcontextprotocol/sdk": "^1.12.0",
-    "zod": "^3.24.0"
-  },
-  "devDependencies": {
-    "@types/node": "^22.19.21",
-    "esbuild": "^0.25.0",
-    "typescript": "^5.6.0"
-  }
-}
+{
+  "name": "standby-design-mcp",
+  "version": "0.1.5",
+  "mcpName": "io.github.KarstenKreh/standby-design-mcp",
+  "description": "MCP server for standby.design — generate production-ready design systems (OKLCH color palettes, fluid type scales, spacing & layout, shape and icon tokens) and export them as CSS, Tailwind v4, or W3C design tokens. Every result links back to the standby.design web UI for visual fine-tuning.",
+  "license": "MIT",
+  "type": "module",
+  "homepage": "https://standby.design",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/KarstenKreh/Standby.Design.git",
+    "directory": "packages/mcp-server"
+  },
+  "bugs": {
+    "url": "https://github.com/KarstenKreh/Standby.Design/issues"
+  },
+  "bin": {
+    "standby-design-mcp": "./dist/index.js"
+  },
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "build": "node build.mjs",
+    "prepublishOnly": "node build.mjs && node smoke.mjs",
+    "typecheck": "tsc --noEmit",
+    "smoke": "node smoke.mjs",
+    "start": "node dist/index.js"
+  },
+  "keywords": [
+    "mcp",
+    "model-context-protocol",
+    "design-system",
+    "design-tokens",
+    "color-palette",
+    "oklch",
+    "typography",
+    "tailwind",
+    "shadcn"
+  ],
+  "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.12.0",
+    "zod": "^3.24.0"
+  },
+  "devDependencies": {
+    "@types/node": "^22.19.21",
+    "esbuild": "^0.25.0",
+    "typescript": "^5.6.0"
+  }
+}