diff --git a/frontend/src/tools/devtools.jsx b/frontend/src/tools/devtools.jsx
index 852ecee..04671af 100644
--- a/frontend/src/tools/devtools.jsx
+++ b/frontend/src/tools/devtools.jsx
@@ -789,24 +789,42 @@ function DatetimeRechner({ mobile }) {
 // ─────────────────────────────────────────────────────────────── Key-Gen ──
 
 const KEY_TYPES = [
-  { id: 'laravel',   label: 'Laravel APP_KEY',        desc: 'base64, 32 Byte',         gen: () => 'base64:' + btoa(String.fromCharCode(...crypto.getRandomValues(new Uint8Array(32)))) },
-  { id: 'jwt_hs256', label: 'JWT Secret (HS256)',      desc: '64 Byte hex',             gen: () => hex(64) },
-  { id: 'jwt_hs512', label: 'JWT Secret (HS512)',      desc: '128 Byte hex',            gen: () => hex(128) },
-  { id: 'aes256',    label: 'AES-256 Key',             desc: '32 Byte base64',          gen: () => b64(32) },
-  { id: 'aes128',    label: 'AES-128 Key',             desc: '16 Byte base64',          gen: () => b64(16) },
-  { id: 'secret32',  label: 'Generic Secret (32B)',    desc: '32 Byte hex',             gen: () => hex(32) },
-  { id: 'secret64',  label: 'Generic Secret (64B)',    desc: '64 Byte hex',             gen: () => hex(64) },
-  { id: 'passwd',    label: 'Passwort (stark)',        desc: '20 Zeichen, alle Typen',  gen: () => genPasswd(20) },
-  { id: 'passwd16',  label: 'Passwort (kurz)',         desc: '16 Zeichen, alle Typen',  gen: () => genPasswd(16) },
-  { id: 'uuid',      label: 'UUID v4',                 desc: 'zufällige UUID',          gen: () => crypto.randomUUID() },
-  { id: 'nanoid',    label: 'NanoID (21)',             desc: 'URL-safe, 21 Zeichen',    gen: () => nanoid(21) },
-  { id: 'nanoid32',  label: 'NanoID (32)',             desc: 'URL-safe, 32 Zeichen',    gen: () => nanoid(32) },
-  { id: 'docker_pw', label: 'DB-Passwort (Docker)',    desc: '24 Zeichen, alnum+sonder',gen: () => genPasswd(24) },
-  { id: 'hex16',     label: 'Hex Token (16B)',         desc: '32 Hex-Zeichen',          gen: () => hex(16) },
-  { id: 'hex32',     label: 'Hex Token (32B)',         desc: '64 Hex-Zeichen',          gen: () => hex(32) },
-  { id: 'b64_32',    label: 'Base64 Token (32B)',      desc: '32 Byte base64',          gen: () => b64(32) },
-  { id: 'b64_64',    label: 'Base64 Token (64B)',      desc: '64 Byte base64',          gen: () => b64(64) },
-  { id: 'b64url_32', label: 'Base64url Token (32B)',   desc: '32 Byte base64url',       gen: () => b64url(32) },
+  { id: 'laravel',   label: 'Laravel APP_KEY',        desc: 'base64, 32 Byte',          example: 'APP_KEY= in .env bei Laravel-Projekten – verschlüsselt Sessions & Daten',
+    gen: () => 'base64:' + btoa(String.fromCharCode(...crypto.getRandomValues(new Uint8Array(32)))) },
+  { id: 'jwt_hs256', label: 'JWT Secret (HS256)',      desc: '64 Byte hex',              example: 'JWT_SECRET= in Node.js/Express-APIs – signiert Login-Tokens',
+    gen: () => hex(64) },
+  { id: 'jwt_hs512', label: 'JWT Secret (HS512)',      desc: '128 Byte hex',             example: 'Wie HS256, aber stärker – für sicherheitskritische APIs empfohlen',
+    gen: () => hex(128) },
+  { id: 'aes256',    label: 'AES-256 Key',             desc: '32 Byte base64',           example: 'Symmetrische Verschlüsselung von Dateien oder Datenbank-Feldern',
+    gen: () => b64(32) },
+  { id: 'aes128',    label: 'AES-128 Key',             desc: '16 Byte base64',           example: 'Leichtgewichtige Verschlüsselung, z.B. für eingebettete Systeme',
+    gen: () => b64(16) },
+  { id: 'secret32',  label: 'Generic Secret (32B)',    desc: '32 Byte hex',              example: 'NEXTAUTH_SECRET=, SESSION_SECRET= oder ähnliche Umgebungsvariablen',
+    gen: () => hex(32) },
+  { id: 'secret64',  label: 'Generic Secret (64B)',    desc: '64 Byte hex',              example: 'Webhook-Signaturen (z.B. GitHub, Stripe) oder API-Signing-Keys',
+    gen: () => hex(64) },
+  { id: 'passwd',    label: 'Passwort (stark)',         desc: '20 Zeichen, alle Typen',   example: 'Admin-Passwörter, Service-Accounts oder initiale DB-Root-Passwörter',
+    gen: () => genPasswd(20) },
+  { id: 'passwd16',  label: 'Passwort (kurz)',          desc: '16 Zeichen, alle Typen',   example: 'Nutzer-Initialpasswörter oder Zugänge mit Zeichenlimit',
+    gen: () => genPasswd(16) },
+  { id: 'uuid',      label: 'UUID v4',                  desc: 'zufällige UUID',           example: 'Eindeutige IDs für Datenbank-Einträge, Dateinamen oder API-Ressourcen',
+    gen: () => crypto.randomUUID() },
+  { id: 'nanoid',    label: 'NanoID (21)',              desc: 'URL-safe, 21 Zeichen',     example: 'Kurze IDs in URLs (z.B. share-Links) – kompakter als UUID',
+    gen: () => nanoid(21) },
+  { id: 'nanoid32',  label: 'NanoID (32)',              desc: 'URL-safe, 32 Zeichen',     example: 'Session-IDs oder Token in URLs ohne Sonderzeichen-Probleme',
+    gen: () => nanoid(32) },
+  { id: 'docker_pw', label: 'DB-Passwort (Docker)',     desc: '24 Zeichen, alnum+sonder', example: 'MYSQL_ROOT_PASSWORD=, POSTGRES_PASSWORD= in docker-compose.yml',
+    gen: () => genPasswd(24) },
+  { id: 'hex16',     label: 'Hex Token (16B)',          desc: '32 Hex-Zeichen',           example: 'Kurze API-Keys, CSRF-Tokens oder Einmal-Codes',
+    gen: () => hex(16) },
+  { id: 'hex32',     label: 'Hex Token (32B)',          desc: '64 Hex-Zeichen',           example: 'Passwort-Reset-Links, E-Mail-Verifikations-Tokens',
+    gen: () => hex(32) },
+  { id: 'b64_32',    label: 'Base64 Token (32B)',       desc: '32 Byte base64',           example: 'Cookie-Signing-Keys oder kompakte Secrets in YAML/JSON-Configs',
+    gen: () => b64(32) },
+  { id: 'b64_64',    label: 'Base64 Token (64B)',       desc: '64 Byte base64',           example: 'VAPID-Keys (Web Push), OAuth Client Secrets',
+    gen: () => b64(64) },
+  { id: 'b64url_32', label: 'Base64url Token (32B)',    desc: '32 Byte base64url',        example: 'OAuth2 state/code_verifier, JWT-kompatible Token ohne Padding',
+    gen: () => b64url(32) },
 ];
 
 function hex(bytes) {
@@ -885,6 +903,7 @@ function KeyGen({ toast }) {
               <div style={{flex:1,minWidth:0}}>
                 <span style={{color:'#fff',fontFamily:'monospace',fontSize:12,fontWeight:600}}>{kt.label}</span>
                 <span style={{color:'rgba(255,255,255,0.4)',fontFamily:'monospace',fontSize:10,marginLeft:8}}>{kt.desc}</span>
+                <div style={{color:'rgba(255,255,255,0.45)',fontSize:11,marginTop:2,fontFamily:'sans-serif'}}>{kt.example}</div>
               </div>
               <button style={{...S.btn('#4ecdc4',false), fontSize:10, padding:'4px 12px', flexShrink:0}}
                 onClick={()=>generate(kt.id)}>⟳ Neu</button>
@@ -926,10 +945,8 @@ const TOOL_DEFS = [
    components:{explain:CronExplainer,build:CronBuilder}},
   {id:'elektro', label:'⚡ Elektro',   desc:'Ohm, Leistung, Kosten, Widerstände', ready:true, component:ElektroRechner},
   {id:'json',      label:'{ } JSON',       desc:'JSON formatieren',             ready:false},
-  {id:'base64',    label:'🔐 Base64',      desc:'Text ↔ Base64',                ready:false},
   {id:'regex',     label:'🔍 Regex',       desc:'Regex testen',                 ready:false},
   {id:'diff',      label:'± Text Diff',   desc:'Texte vergleichen',            ready:false},
-  {id:'jwt',       label:'🔑 JWT',        desc:'JWT dekodieren',               ready:false},
   {id:'datetime',  label:'📅 Datetime',   desc:'Zeiten umrechnen · Geburtstag · Differenz', ready:true, component:DatetimeRechner},
   {id:'keygen',    label:'🔐 Key-Gen',    desc:'Sichere Keys & Secrets generieren',  ready:true, component:KeyGen},
 ];