diff --git a/fastapi_server/front_apis.py b/fastapi_server/front_apis.py
index daf0ac7..67e9d24 100644
--- a/fastapi_server/front_apis.py
+++ b/fastapi_server/front_apis.py
@@ -128,7 +128,7 @@ def _mask_auth_key(value: str) -> str:
         return ""
     if len(value) <= 10:
         return value
-    return f"{value[:6]}...{value[-4:]}"
+    return f"{value[:5]}...{value[-5:]}"
 
 def _prune_stopped_pipelines() -> None:
     stale_ids: List[str] = []
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 95e57f4..f1bf9ef 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -74,6 +74,17 @@ function parseToolCsv(value: string): string[] {
   return out;
 }
 
+function maskSecretPreview(value: string): string {
+  const trimmed = value.trim();
+  if (!trimmed) {
+    return "";
+  }
+  if (trimmed.length <= 10) {
+    return trimmed;
+  }
+  return `${trimmed.slice(0, 5)}...${trimmed.slice(-5)}`;
+}
+
 function getGraphArchImage(graphId: string): string | null {
   const normalizedGraphId = graphId.trim().toLowerCase();
   for (const [path, source] of Object.entries(GRAPH_ARCH_IMAGE_MODULES)) {
@@ -674,6 +685,9 @@ export default function App() {
                 placeholder="Enter provider API key"
                 disabled={busy}
               />
+              {editor.apiKey ? (
+                <small className="empty">Preview: {maskSecretPreview(editor.apiKey)}</small>
+              ) : null}
             </label>
 
             <label>