feat(agent): add Claude Code-style agent, skills, slash-commands, hooks, todos, sandboxed workspace, and full-stack scaffolding

Adds Claude Code-inspired agent capabilities:
- Agent loop with tools (read/write/edit/glob/grep/bash/todos)
- Skills system (markdown skill files, runtime loading)
- Slash commands (/commit /review /feature /design /explain /test /refactor /skill /help)
- Hooks system (block-dangerous-rm, warn-debug-code, warn-secrets-in-code, warn-eval-exec)
- Sandboxed workspace with path-escape protection
- Todo lists (todo_write / todo_read / todo_update)
- Full-stack scaffolding skill
- No external SDK dependencies; no Next.js conversion

CLAUDE.md

@@ -22,7 +22,7 @@ code/
 ├── model/
 │   ├── loader.py               ← Dual model loading (text + VLM)
 │   └── inference.py            ← Streaming inference (text + VLM)
-├── agent/__init__.py           ← Agent loop (model ↔ tools)
+├── agent/__init__.py           ← Agent loop (model ↔ tools, supports custom agents)
 ├── tools/
 │   ├── fs.py                   ← read_file, write_file, edit_file, glob, grep, list_dir
 │   ├── bash.py                 ← Sandboxed shell execution
@@ -30,9 +30,12 @@ code/
 ├── skills/
 │   ├── __init__.py             ← Skill discovery + loading
 │   └── builtins/               ← Built-in skills (markdown)
+├── agents/                     ← Custom Agent system (AI-generated personas)
+│   ├── __init__.py             ← Agent CRUD + system-prompt builder
+│   └── builtins/               ← Built-in agents (code-reviewer, test-writer)
 ├── commands/
 │   ├── __init__.py             ← Slash command parser + expander
-│   └── builtins/               ← Built-in commands (markdown)
+│   └── builtins/               ← Built-in commands (markdown, includes /agent)
 ├── hooks/
 │   ├── __init__.py             ← Hook rule engine
 │   └── builtins/               ← Built-in hook rules (markdown)
@@ -106,8 +109,74 @@ content: |
 | `/test <target>` | Generate tests |
 | `/refactor <target>` | Refactor code for clarity |
 | `/skill <name>` | Load and apply a skill |
+| `/agent create <desc>` | AI generates a custom agent from natural-language description |
+| `/agent use <name>` | Activate a saved agent |
+| `/agent list` | List all saved agents |
+| `/agent show <name>` | Show an agent's full definition |
+| `/agent delete <name>` | Delete a user-defined agent |
+| `/agent reset` | Reset to default SoniCoder persona |
 | `/help` | Show available commands and skills |
 
+## Custom Agents
+
+Custom agents are AI-generated personas layered on top of the base SoniCoder
+system prompt. They can restrict the tool whitelist, auto-load skills, and
+override temperature / max-iterations.
+
+### Agent file format
+
+Agents live in `workspace/.sonicoder/agents/<name>/AGENT.md` (built-ins in
+`code/agents/builtins/<name>/AGENT.md`). Format:
+
+```markdown
+---
+name: my-agent
+description: One-line description
+tools: read_file, list_dir, grep, bash
+skills: code-review
+temperature: 0.2
+max_iterations: 12
+tags: review, quality
+author: AI-generated
+created: 2026-06-20
+---
+
+# My Agent
+
+Full system-prompt extension here. Define the persona, workflow, output format,
+and any hard rules.
+```
+
+### How `/agent create` works
+
+1. User runs `/agent create a security reviewer that flags hardcoded secrets`.
+2. The slash-command expansion substitutes `AGENT_GENERATION_PROMPT` (defined
+   in `code/agents/__init__.py`) into the prompt.
+3. The base SoniCoder model (NOT a custom agent) authors an `AGENT.md` file
+   via `write_file` and saves it under `.sonicoder/agents/<name>/`.
+4. The user can then `/agent use <name>` or click the agent in the UI.
+
+### Built-in agents
+
+| Agent | Description |
+|-------|-------------|
+| `code-reviewer` | Read-only reviewer, structured issues table output |
+| `test-writer` | Generates pytest/jest tests, runs them, iterates until green |
+
+### API endpoints
+
+| Endpoint | Description |
+|----------|-------------|
+| `list_agents` | List all agents (builtins + user) and the active one |
+| `get_agent(name)` | Get a single agent's full definition |
+| `save_agent(...)` | Create or overwrite a user agent (manual save) |
+| `delete_agent(name)` | Delete a user agent (built-ins protected) |
+| `set_active_agent(name)` | Set/clear the active agent for subsequent prompts |
+
+The `agent_run` endpoint also intercepts `/agent use|reset|delete|list` and
+dispatches them directly to the agents module, bypassing the model entirely
+for instant session-state updates.
+
 ## Skills
 
 | Skill | Description |

README.md

@@ -23,7 +23,8 @@ Inspired by [Claude Code](https://github.com/anthropics/claude-code), SoniCoder
 
 - 🤖 **Agent Loop** — model calls tools (read/write/edit/glob/grep/bash/todos) in a feedback loop
 - 🎯 **Skills System** — load markdown skill files at runtime (frontend-design, feature-dev, code-review, debugging, fullstack-scaffold, commit-workflow)
-- ⚡ **Slash Commands** — `/commit`, `/review`, `/feature`, `/design`, `/explain`, `/test`, `/refactor`, `/skill`, `/help`
+- ⚡ **Slash Commands** — `/commit`, `/review`, `/feature`, `/design`, `/explain`, `/test`, `/refactor`, `/skill`, `/agent`, `/help`
+- 🧠 **Custom Agents** — describe a specialized agent in natural language and the AI generates a full persona (system prompt + tool whitelist + auto-loaded skills + temperature + max iterations). Activate via `/agent use <name>` or the Agents panel. Built-ins: `code-reviewer`, `test-writer`.
 - 🪝 **Hooks System** — pre/post tool execution rules (block dangerous commands, warn on debug code/secrets)
 - 📁 **Sandboxed Workspace** — agent manipulates files in `./workspace/` (path-escape protected)
 - ✅ **Todo Lists** — track multi-step tasks Claude Code-style
@@ -86,8 +87,35 @@ The agent can call these tools (Claude Code-style):
 | `/test [target]` | Generate tests |
 | `/refactor <target>` | Refactor code for clarity |
 | `/skill <name>` | Load and apply a skill |
+| `/agent create <desc>` | **AI generates a custom agent from a natural-language description** |
+| `/agent use <name>` | Activate a saved agent for subsequent prompts |
+| `/agent list` | List all saved agents |
+| `/agent show <name>` | Display an agent's full definition |
+| `/agent delete <name>` | Delete a user-defined agent |
+| `/agent reset` | Reset to default SoniCoder persona |
 | `/help` | Show available commands and skills |
 
+### Custom Agents
+
+Custom agents are AI-generated personas that layer on top of the base SoniCoder system prompt. Each agent defines:
+
+- A **system-prompt extension** (persona, workflow, output format)
+- A **tool whitelist** (e.g. a read-only reviewer gets `read_file`, `grep`, `bash` but not `write_file`)
+- **Auto-loaded skills** (e.g. `code-review` for a reviewer agent)
+- A **temperature** and **max_iterations** override
+
+**Two ways to create one:**
+
+1. **AI-generated** (recommended): Type `/agent create <natural-language description>` in chat, or use the "AI-Generate a Custom Agent" box in the Agent tab. The model authors an `AGENT.md` file for you.
+2. **Manual**: Click "Write manually" in the Agents panel and fill in the fields directly.
+
+**Built-in agents:**
+
+- `code-reviewer` — read-only reviewer that produces a structured issues table
+- `test-writer` — generates pytest/jest tests, runs them, and iterates until green
+
+Agent files are saved to `workspace/.sonicoder/agents/<name>/AGENT.md`. Built-ins live in `code/agents/builtins/` and cannot be deleted.
+
 ### Built-in Skills
 
 - **frontend-design** — distinctive visual design guidance (palette, typography, signature)

code/agent/__init__.py

@@ -388,8 +388,14 @@ def build_agent_system_prompt(
     target_language: str = "",
     target_framework: str = "",
     skills: list[str] | None = None,
+    agent_name: str | None = None,
 ) -> str:
-    """Build the system prompt with tool descriptions and skill context."""
+    """Build the system prompt with tool descriptions and skill context.
+
+    If `agent_name` is provided and matches a saved custom agent, that
+    agent's persona/system-prompt extension is appended, and any skills
+    declared on the agent are auto-loaded.
+    """
     parts = [
         SYSTEM_PROMPT,
         "",
@@ -409,7 +415,27 @@ def build_agent_system_prompt(
         parts.append("")
         parts.append(f"Target: {target_language}" + (f" / {target_framework}" if target_framework else ""))
 
-    skills_ctx = build_skills_context(skills)
+    # ── Custom agent persona ───────────────────────────────────────────
+    merged_skills = list(skills or [])
+    if agent_name:
+        try:
+            from code.agents import get_agent, build_agent_system_prompt_extension, ALL_TOOLS
+            agent_cfg = get_agent(agent_name)
+            if agent_cfg:
+                ext = build_agent_system_prompt_extension(agent_name)
+                if ext:
+                    parts.append("")
+                    parts.append(ext)
+                # Auto-merge agent-declared skills (after user-selected ones)
+                for s in agent_cfg.get("skills", []):
+                    if s not in merged_skills:
+                        merged_skills.append(s)
+            else:
+                logger.warning("Agent '%s' not found; running default", agent_name)
+        except Exception as exc:
+            logger.warning("Failed to load custom agent '%s': %s", agent_name, exc)
+
+    skills_ctx = build_skills_context(merged_skills or None)
     if skills_ctx:
         parts.append("")
         parts.append("## Skills Loaded")
@@ -427,6 +453,7 @@ def run_agent(
     skills: list[str] | None = None,
     search_context: str = "",
     image_url: str | None = None,
+    agent_name: str | None = None,
 ) -> Iterator[dict[str, Any]]:
     """Run the agent loop. Yields events as dict.
 
@@ -481,8 +508,57 @@ def run_agent(
         }
         return
 
+    # ── Resolve active agent (explicit > session-active > none) ──────
+    if not agent_name:
+        try:
+            from code.agents import get_active_agent
+            agent_name = get_active_agent()
+        except Exception:
+            agent_name = None
+
+    # ── Special-case: /agent create → AI generates an agent definition ─
+    # The slash-command expansion already substituted the AGENT_GENERATION_PROMPT
+    # into `user_input`, so we just need to make sure agent_name is NOT applied
+    # (we want the default SoniCoder persona to author the new agent).
+    creating_agent = False
+    if user_input.lstrip().startswith("You are creating a custom agent definition"):
+        creating_agent = True
+        agent_name = None  # don't layer persona on top of meta-prompt
+
+    # ── Load agent config (for tool whitelist + max_iterations) ────────
+    agent_cfg = None
+    if agent_name and not creating_agent:
+        try:
+            from code.agents import get_agent
+            agent_cfg = get_agent(agent_name)
+            if not agent_cfg:
+                yield {
+                    "type": "status",
+                    "status_text": f"Agent '{agent_name}' not found; using default.",
+                    "status_state": "warning",
+                }
+                agent_name = None
+            else:
+                yield {
+                    "type": "status",
+                    "status_text": f"Running as agent: {agent_cfg['name']}",
+                    "status_state": "working",
+                    "agent": agent_cfg["name"],
+                }
+        except Exception as exc:
+            logger.warning("Failed to load agent '%s': %s", agent_name, exc)
+            agent_name = None
+
+    # Determine iteration cap
+    iter_cap = MAX_ITERATIONS
+    if agent_cfg and agent_cfg.get("max_iterations"):
+        try:
+            iter_cap = max(1, min(40, int(agent_cfg["max_iterations"])))
+        except (ValueError, TypeError):
+            pass
+
     # Build system prompt
-    system_prompt = build_agent_system_prompt(target_language, target_framework, skills)
+    system_prompt = build_agent_system_prompt(target_language, target_framework, skills, agent_name=agent_name)
 
     # Add search context if present
     if search_context:
@@ -498,7 +574,7 @@ def run_agent(
     messages.append({"role": "user", "content": user_input})
 
     # Agent loop
-    for iteration in range(MAX_ITERATIONS):
+    for iteration in range(iter_cap):
         yield {
             "type": "status",
             "status_text": f"Thinking... (step {iteration + 1})",
@@ -537,6 +613,34 @@ def run_agent(
             tool_name = tc.get("tool")
             args = tc.get("args", {})
 
+            # ── Enforce agent tool whitelist ────────────────────────────
+            if agent_cfg and agent_cfg.get("tools"):
+                allowed = set(agent_cfg["tools"])
+                if tool_name not in allowed:
+                    tool_result = {
+                        "success": False,
+                        "error": (
+                            f"Tool '{tool_name}' is not in the active agent's "
+                            f"whitelist: {sorted(allowed)}. The agent '{agent_cfg['name']}' "
+                            "is configured to use only those tools."
+                        ),
+                        "blocked_by_agent_whitelist": True,
+                    }
+                    yield {
+                        "type": "tool_result",
+                        "tool": tool_name,
+                        "result": tool_result,
+                        "iteration": iteration + 1,
+                    }
+                    # Feed back to model so it can pick a different tool
+                    result_str = json.dumps(tool_result, indent=2, default=str)
+                    messages.append({"role": "assistant", "content": full_response})
+                    messages.append({
+                        "role": "user",
+                        "content": f"Tool `{tool_name}` result:\n```json\n{result_str}\n```\n\nChoose a different tool from the agent's whitelist, or finish if done.",
+                    })
+                    continue
+
             if "error" in tc:
                 # Unknown tool
                 tool_result = {"success": False, "error": tc["error"]}
@@ -568,5 +672,5 @@ def run_agent(
     yield {
         "type": "complete",
         "content": full_response + "\n\n_(Max iterations reached)_",
-        "iterations": MAX_ITERATIONS,
+        "iterations": iter_cap,
     }

code/agents/__init__.py

@@ -0,0 +1,397 @@
+"""Custom Agent system — AI-generated, user-saved agent personas.
+
+Inspired by Claude Code's sub-agent / agent-customization patterns. A custom
+agent is a markdown file (`AGENT.md`) with YAML frontmatter that defines:
+
+  - name          : unique kebab-case identifier
+  - description   : one-line summary
+  - tools         : comma-separated subset of the agent tool registry
+                    (default: all tools)
+  - skills        : comma-separated skill names to auto-load
+  - temperature   : float 0.0–1.0 (optional)
+  - max_iterations: int (optional, overrides default)
+  - tags          : comma-separated tags
+  - author        : "user" | "AI-generated"
+  - created       : ISO date
+
+The body of the file is a system-prompt extension that is appended to the
+base SoniCoder system prompt when the agent is active.
+
+Storage layout:
+    workspace/.sonicoder/agents/<agent-name>/AGENT.md
+
+Built-in agents live in `code/agents/builtins/` (read-only).
+"""
+
+from __future__ import annotations
+
+import logging
+import os
+import re
+from datetime import date
+from typing import Any
+
+from code.skills import _parse_frontmatter  # reuse the same simple YAML parser
+
+logger = logging.getLogger(__name__)
+
+# ─── Discovery roots ────────────────────────────────────────────────────
+
+_BUILTIN_AGENTS_DIR = os.path.join(os.path.dirname(__file__), "builtins")
+_USER_AGENTS_DIRNAME = ".sonicoder/agents"  # relative to workspace root
+
+# All tools available to the agent — kept in sync with code/agent.TOOL_REGISTRY
+ALL_TOOLS: tuple[str, ...] = (
+    "read_file",
+    "write_file",
+    "edit_file",
+    "multi_edit",
+    "list_dir",
+    "glob",
+    "grep",
+    "bash",
+    "todo_read",
+    "todo_write",
+    "todo_update",
+)
+
+# Session state: the currently active agent (None = default SoniCoder)
+_active_agent: str | None = None
+
+
+# ─── Helpers ────────────────────────────────────────────────────────────
+
+def _agent_dirs() -> list[str]:
+    """Return all directories to search for agents (builtins first)."""
+    dirs = [_BUILTIN_AGENTS_DIR]
+    try:
+        from code.tools.fs import get_workspace_root
+        user_dir = os.path.join(get_workspace_root(), _USER_AGENTS_DIRNAME)
+        if os.path.isdir(user_dir):
+            dirs.append(user_dir)
+    except Exception:
+        pass
+    return dirs
+
+
+def _user_agents_dir() -> str:
+    """Return the user agents directory (creating it if missing)."""
+    from code.tools.fs import get_workspace_root
+    user_dir = os.path.join(get_workspace_root(), _USER_AGENTS_DIRNAME)
+    os.makedirs(user_dir, exist_ok=True)
+    return user_dir
+
+
+def _safe_agent_name(name: str) -> str:
+    """Sanitize an agent name to kebab-case."""
+    name = name.strip().lower()
+    name = re.sub(r"[^a-z0-9-]+", "-", name)
+    name = re.sub(r"-+", "-", name).strip("-")
+    if not name:
+        raise ValueError("Agent name must contain at least one alphanumeric character")
+    if len(name) > 64:
+        name = name[:64].rstrip("-")
+    return name
+
+
+def _load_agent(agent_dir: str) -> dict[str, Any] | None:
+    """Load a single agent definition from a directory containing AGENT.md."""
+    agent_md = os.path.join(agent_dir, "AGENT.md")
+    if not os.path.isfile(agent_md):
+        return None
+
+    try:
+        with open(agent_md, "r", encoding="utf-8") as f:
+            content = f.read()
+    except Exception as exc:
+        logger.warning("Failed to read %s: %s", agent_md, exc)
+        return None
+
+    meta, body = _parse_frontmatter(content)
+
+    # Parse comma-separated list fields
+    def _split_csv(v: str) -> list[str]:
+        return [s.strip() for s in (v or "").split(",") if s.strip()]
+
+    tools = _split_csv(meta.get("tools", ""))
+    if not tools:
+        tools = list(ALL_TOOLS)
+    # Filter to known tools (defensive)
+    tools = [t for t in tools if t in ALL_TOOLS]
+
+    skills = _split_csv(meta.get("skills", ""))
+    tags = _split_csv(meta.get("tags", ""))
+
+    try:
+        temperature = float(meta["temperature"]) if meta.get("temperature") else None
+    except (ValueError, TypeError):
+        temperature = None
+
+    try:
+        max_iterations = int(meta["max_iterations"]) if meta.get("max_iterations") else None
+    except (ValueError, TypeError):
+        max_iterations = None
+
+    return {
+        "name": meta.get("name") or os.path.basename(agent_dir),
+        "description": meta.get("description", ""),
+        "tools": tools,
+        "skills": skills,
+        "temperature": temperature,
+        "max_iterations": max_iterations,
+        "tags": tags,
+        "author": meta.get("author", "user"),
+        "created": meta.get("created", ""),
+        "body": body.strip(),
+        "path": agent_dir,
+    }
+
+
+# ─── Public API ──────��──────────────────────────────────────────────────
+
+def list_agents() -> list[dict[str, Any]]:
+    """List all available agents (builtins + user). Returns metadata only."""
+    agents: list[dict[str, Any]] = []
+    seen: set[str] = set()
+
+    for agents_dir in _agent_dirs():
+        if not os.path.isdir(agents_dir):
+            continue
+        for entry in sorted(os.listdir(agents_dir)):
+            entry_path = os.path.join(agents_dir, entry)
+            if not os.path.isdir(entry_path):
+                continue
+            agent = _load_agent(entry_path)
+            if agent and agent["name"] not in seen:
+                seen.add(agent["name"])
+                agents.append({
+                    "name": agent["name"],
+                    "description": agent["description"],
+                    "tools": agent["tools"],
+                    "skills": agent["skills"],
+                    "tags": agent["tags"],
+                    "author": agent["author"],
+                    "active": agent["name"] == _active_agent,
+                })
+    return agents
+
+
+def get_agent(name: str) -> dict[str, Any] | None:
+    """Get full agent definition by name (or None if not found)."""
+    name = _safe_agent_name(name)
+    for agents_dir in _agent_dirs():
+        if not os.path.isdir(agents_dir):
+            continue
+        for entry in os.listdir(agents_dir):
+            entry_path = os.path.join(agents_dir, entry)
+            if not os.path.isdir(entry_path):
+                continue
+            agent = _load_agent(entry_path)
+            if agent and agent["name"] == name:
+                return agent
+    return None
+
+
+def agent_exists(name: str) -> bool:
+    return get_agent(name) is not None
+
+
+def save_agent(
+    name: str,
+    description: str,
+    body: str,
+    tools: list[str] | None = None,
+    skills: list[str] | None = None,
+    temperature: float | None = None,
+    max_iterations: int | None = None,
+    tags: list[str] | None = None,
+    author: str = "user",
+) -> dict[str, Any]:
+    """Save (create or overwrite) an agent definition."""
+    name = _safe_agent_name(name)
+
+    # Validate tools
+    if tools:
+        invalid = [t for t in tools if t not in ALL_TOOLS]
+        if invalid:
+            return {"success": False, "error": f"Unknown tools: {invalid}", "valid_tools": list(ALL_TOOLS)}
+        tools_str = ", ".join(tools)
+    else:
+        tools_str = ", ".join(ALL_TOOLS)
+
+    skills_str = ", ".join(skills) if skills else ""
+    tags_str = ", ".join(tags) if tags else ""
+    temp_str = f"{temperature:.2f}" if temperature is not None else ""
+    iter_str = str(max_iterations) if max_iterations is not None else ""
+
+    # Build the markdown file
+    frontmatter_lines = [
+        "---",
+        f"name: {name}",
+        f"description: {description.strip()[:200]}",
+        f"tools: {tools_str}",
+        f"skills: {skills_str}",
+    ]
+    if temp_str:
+        frontmatter_lines.append(f"temperature: {temp_str}")
+    if iter_str:
+        frontmatter_lines.append(f"max_iterations: {iter_str}")
+    if tags_str:
+        frontmatter_lines.append(f"tags: {tags_str}")
+    frontmatter_lines.append(f"author: {author}")
+    frontmatter_lines.append(f"created: {date.today().isoformat()}")
+    frontmatter_lines.append("---")
+    frontmatter_lines.append("")
+    frontmatter_lines.append(body.strip())
+    frontmatter_lines.append("")
+
+    content = "\n".join(frontmatter_lines)
+
+    # Write to workspace/.sonicoder/agents/<name>/AGENT.md
+    agents_dir = _user_agents_dir()
+    agent_dir = os.path.join(agents_dir, name)
+    os.makedirs(agent_dir, exist_ok=True)
+    agent_md = os.path.join(agent_dir, "AGENT.md")
+    with open(agent_md, "w", encoding="utf-8") as f:
+        f.write(content)
+
+    logger.info("Saved agent '%s' to %s", name, agent_md)
+    return {"success": True, "name": name, "path": agent_md}
+
+
+def delete_agent(name: str) -> dict[str, Any]:
+    """Delete a user-defined agent. Built-ins cannot be deleted."""
+    name = _safe_agent_name(name)
+    agent = get_agent(name)
+    if not agent:
+        return {"success": False, "error": f"Agent not found: {name}"}
+
+    # Only allow deleting files under the user agents dir
+    from code.tools.fs import get_workspace_root
+    user_dir = os.path.join(get_workspace_root(), _USER_AGENTS_DIRNAME)
+    if not agent["path"].startswith(user_dir + os.sep):
+        return {"success": False, "error": f"Cannot delete built-in agent: {name}"}
+
+    import shutil
+    try:
+        shutil.rmtree(os.path.dirname(agent["path"]), ignore_errors=True)
+    except Exception as exc:
+        return {"success": False, "error": str(exc)}
+
+    if _active_agent == name:
+        set_active_agent(None)
+
+    logger.info("Deleted agent '%s'", name)
+    return {"success": True, "name": name}
+
+
+def set_active_agent(name: str | None) -> dict[str, Any]:
+    """Set the active agent for subsequent prompts. None resets to default."""
+    global _active_agent
+    if name is None or name.strip() == "":
+        _active_agent = None
+        return {"success": True, "active_agent": None, "message": "Reset to default SoniCoder agent"}
+    name = _safe_agent_name(name)
+    if not agent_exists(name):
+        return {"success": False, "error": f"Agent not found: {name}"}
+    _active_agent = name
+    return {"success": True, "active_agent": name}
+
+
+def get_active_agent() -> str | None:
+    """Return the name of the currently active agent, or None."""
+    return _active_agent
+
+
+def get_active_agent_config() -> dict[str, Any] | None:
+    """Return the full config of the active agent, or None if default."""
+    if _active_agent is None:
+        return None
+    return get_agent(_active_agent)
+
+
+def build_agent_system_prompt_extension(agent_name: str) -> str:
+    """Build the system-prompt extension for a custom agent.
+
+    Returns empty string if the agent doesn't exist or has no body.
+    """
+    agent = get_agent(agent_name)
+    if not agent:
+        return ""
+    parts: list[str] = []
+    parts.append(f"# Active Custom Agent: {agent['name']}")
+    if agent["description"]:
+        parts.append(f"_{agent['description']}_")
+    parts.append("")
+    parts.append("You are operating under this custom agent persona. Follow its instructions and workflow.")
+    parts.append("")
+    parts.append("## Agent Persona & Instructions")
+    parts.append("")
+    parts.append(agent["body"])
+
+    if agent["tools"] and len(agent["tools"]) < len(ALL_TOOLS):
+        parts.append("")
+        parts.append("## Tool Whitelist for this Agent")
+        parts.append(
+            f"You may ONLY use these tools: {', '.join(agent['tools'])}. "
+            "Do not call any other tool."
+        )
+
+    if agent["skills"]:
+        parts.append("")
+        parts.append("## Auto-loaded Skills")
+        parts.append(f"The following skills are pre-loaded for this agent: {', '.join(agent['skills'])}")
+
+    return "\n".join(parts)
+
+
+# ─── AI generation helper ───────────────────────────────────────────────
+
+# The meta-prompt sent to the model when a user runs `/agent create <desc>`.
+AGENT_GENERATION_PROMPT = """You are creating a custom agent definition for SoniCoder.
+
+Based on the user's description, generate a complete AGENT.md file that defines a specialized agent persona.
+
+## Available Tools (pick a subset, or all)
+read_file, write_file, edit_file, multi_edit, list_dir, glob, grep, bash, todo_read, todo_write, todo_update
+
+## Available Built-in Skills (pick zero or more)
+frontend-design, feature-dev, code-review, debugging, fullstack-scaffold, commit-workflow
+
+## Output Format
+Use the @@FILE: multi-file format to write exactly ONE file:
+
+@@FILE: .sonicoder/agents/<kebab-case-name>/AGENT.md
+---
+name: <kebab-case-name>
+description: <one-line description, max 200 chars>
+tools: <comma-separated subset of available tools>
+skills: <comma-separated skill names, or empty>
+temperature: <float 0.0-1.0 — lower for precise tasks, higher for creative>
+max_iterations: <int 4-20>
+tags: <comma-separated tags>
+author: AI-generated
+created: <today's date YYYY-MM-DD>
+---
+
+# <Agent Name in Title Case>
+
+<Full system prompt extension. Include:>
+<- Persona description (who the agent is)>
+<- Core responsibilities>
+<- Workflow / step-by-step approach>
+<- Output format expectations>
+<- Critical rules and constraints>
+
+@@END@@
+
+## Rules
+- The agent name MUST be kebab-case (lowercase, hyphens only).
+- Pick tools that match the agent's purpose — don't give a read-only reviewer `write_file`.
+- The body should be 150-400 words, specific and actionable.
+- Do NOT include any other files. Just the one AGENT.md.
+- After writing the file, briefly tell the user they can activate the agent with `/agent use <name>`.
+
+## User's Description
+$ARGUMENTS
+"""

code/agents/builtins/code-reviewer/AGENT.md

@@ -0,0 +1,52 @@
+---
+name: code-reviewer
+description: Read-only agent that reviews code for bugs, style, and best practices. Never modifies files.
+tools: read_file, list_dir, glob, grep, bash, todo_read, todo_write
+skills: code-review
+temperature: 0.2
+max_iterations: 12
+tags: review, quality, readonly
+author: builtin
+created: 2026-06-20
+---
+
+# Code Reviewer
+
+You are a meticulous code reviewer. Your job is to read the user's code and produce a structured review — you do **not** modify files.
+
+## Workflow
+
+1. Use `list_dir` to map the project structure.
+2. Use `todo_write` to plan the review (e.g., "Review entry point", "Review tests", "Review configs").
+3. For each file in scope, `read_file` and analyze.
+4. Use `grep` to find patterns (TODOs, FIXMEs, dangerous calls, missing error handling).
+5. Optionally run `bash` for static checks: `npm test`, `pytest --collect-only`, `ruff check .`, `eslint .`.
+6. Produce a final structured review.
+
+## Output Format
+
+End your review with this exact structure:
+
+### Summary
+One paragraph (3-5 sentences) describing the overall code quality.
+
+### Issues Found
+
+| Severity | File:Line | Issue | Recommendation |
+|----------|-----------|-------|----------------|
+| High     | src/app.py:42 | SQL injection via string concat | Use parameterized queries |
+| Medium   | src/utils.py:18 | Missing input validation | Add `isinstance(x, int)` guard |
+| Low      | src/main.py:5 | Unused import `os` | Remove |
+
+### Strengths
+- Bullet list of what the code does well.
+
+### Next Steps
+- 2-3 concrete actions the author should take.
+
+## Rules
+
+- NEVER call `write_file`, `edit_file`, or `multi_edit` — you are read-only.
+- Always cite file:line in issues.
+- Be specific — "improve readability" is useless; "rename `x` to `user_count`" is useful.
+- If a test file is missing, flag it as a High severity issue.

code/agents/builtins/test-writer/AGENT.md

@@ -0,0 +1,52 @@
+---
+name: test-writer
+description: Generates test suites for existing code. Reads source, writes pytest/jest tests, runs them, and iterates until green.
+tools: read_file, write_file, edit_file, list_dir, glob, grep, bash, todo_read, todo_write, todo_update
+skills: debugging
+temperature: 0.3
+max_iterations: 15
+tags: testing, quality, tdd
+author: builtin
+created: 2026-06-20
+---
+
+# Test Writer
+
+You are a test engineering specialist. Given a codebase, you write comprehensive tests, run them, and iterate until they pass.
+
+## Workflow
+
+1. `list_dir` and `read_file` the main source files to understand the public API.
+2. `todo_write` a test plan: one todo per module/function to test.
+3. Detect the test framework (`grep` for `pytest`, `jest`, `mocha`, `unittest`).
+4. Write test files using `write_file` (Python: `tests/test_<module>.py`; JS: `__tests__/<module>.test.js`).
+5. Run the tests with `bash` (`pytest -v` or `npm test`).
+6. If tests fail, `read_file` the failure, `edit_file` the test (or report a real bug in source).
+7. Repeat until green or max iterations.
+8. Report final coverage summary.
+
+## Test Writing Rules
+
+- Test **behavior**, not implementation details.
+- Use descriptive test names: `test_user_cannot_withdraw_more_than_balance` not `test_1`.
+- Cover: happy path, edge cases (empty input, None, negative numbers), error paths.
+- Use fixtures/setup; avoid duplicate boilerplate.
+- For Python, prefer `pytest` with `@pytest.mark.parametrize`.
+- For JS, prefer `jest` with `describe`/`it`/`expect`.
+- Do NOT mock what you don't own without good reason.
+- Aim for at least 3 tests per public function.
+
+## Output Format
+
+End with:
+
+### Test Run Summary
+- Tests passed: X / Y
+- Coverage: N% (if measurable)
+- Files created/modified:
+  - `tests/test_foo.py` (new, 8 tests)
+  - `tests/conftest.py` (new, shared fixtures)
+
+### Notes
+- Any source-code bugs discovered while writing tests.
+- Suggestions for improving testability.

code/commands/builtins/agent.md

@@ -0,0 +1,100 @@
+---
+name: agent
+description: Create, use, list, show, delete, or reset custom AI agents
+argument-hint: create <description> | use <name> | list | show <name> | delete <name> | reset
+---
+# Custom Agent Command
+
+The user invoked `/agent` with arguments: `$ARGUMENTS`
+
+## Parse the arguments and follow the matching branch
+
+### If arguments start with `create ` (i.e. `/agent create <description>`)
+You are creating a custom agent definition based on the user's natural-language description. Follow the AGENT_GENERATION_PROMPT (which is included below) to author an AGENT.md file, then use `write_file` to save it under `.sonicoder/agents/<name>/AGENT.md` in the workspace.
+
+After saving, briefly tell the user the agent's name and that they can activate it with `/agent use <name>` or by clicking it in the Agents panel of the Agent tab.
+
+The description provided by the user is:
+**$ARGUMENTS** (everything after `/agent create ` — strip the leading word "create")
+
+Use the AGENT_GENERATION_PROMPT exactly. Write only the AGENT.md file — no other files.
+
+### If arguments start with `use ` (i.e. `/agent use <name>`)
+Tell the user that the agent has been set as active for subsequent prompts. Mention the agent's name and description (if known). Note: actual activation is performed by the backend when this command is dispatched; just acknowledge it.
+
+### If arguments are `list`
+List all available agents by reading the `.sonicoder/agents/` directory (use `list_dir` or `glob`) plus the built-in agents (which you cannot read but you know exist: `code-reviewer`, `test-writer`). Present a table:
+
+| Name | Description | Author | Tools |
+|------|-------------|--------|-------|
+
+### If arguments start with `show ` (i.e. `/agent show <name>`)
+Read the file `.sonicoder/agents/<name>/AGENT.md` from the workspace and display it to the user verbatim in a markdown code block. If the file does not exist, tell the user the agent was not found and suggest `/agent list`.
+
+### If arguments start with `delete ` (i.e. `/agent delete <name>`)
+Tell the user that the agent has been queued for deletion. Actual deletion is performed by the backend. Just acknowledge.
+
+### If arguments are `reset` (or empty)
+Tell the user that the active agent has been reset to the default SoniCoder agent. Subsequent prompts will use the base persona.
+
+### Otherwise (unknown subcommand or no arguments)
+Print a short help message:
+```
+Usage:
+  /agent create <natural-language description>   # AI generates a new agent
+  /agent use <name>                              # Activate a saved agent
+  /agent list                                    # List all agents
+  /agent show <name>                             # Show an agent's full definition
+  /agent delete <name>                           # Delete a user agent
+  /agent reset                                   # Reset to default SoniCoder
+```
+
+## AGENT_GENERATION_PROMPT (use this when subcommand is `create`)
+
+You are creating a custom agent definition for SoniCoder.
+
+Based on the user's description, generate a complete AGENT.md file that defines a specialized agent persona.
+
+### Available Tools (pick a subset, or all)
+read_file, write_file, edit_file, multi_edit, list_dir, glob, grep, bash, todo_read, todo_write, todo_update
+
+### Available Built-in Skills (pick zero or more)
+frontend-design, feature-dev, code-review, debugging, fullstack-scaffold, commit-workflow
+
+### Output Format
+Use the `write_file` tool to save exactly ONE file with this content:
+
+Path: `.sonicoder/agents/<kebab-case-name>/AGENT.md`
+
+```
+---
+name: <kebab-case-name>
+description: <one-line description, max 200 chars>
+tools: <comma-separated subset of available tools>
+skills: <comma-separated skill names, or empty>
+temperature: <float 0.0-1.0 — lower for precise tasks, higher for creative>
+max_iterations: <int 4-20>
+tags: <comma-separated tags>
+author: AI-generated
+created: <today's date YYYY-MM-DD>
+---
+
+# <Agent Name in Title Case>
+
+<Full system prompt extension. Include:>
+<- Persona description (who the agent is)>
+<- Core responsibilities>
+<- Workflow / step-by-step approach>
+<- Output format expectations>
+<- Critical rules and constraints>
+```
+
+### Rules
+- The agent name MUST be kebab-case (lowercase, hyphens only).
+- Pick tools that match the agent's purpose — don't give a read-only reviewer `write_file`.
+- The body should be 150-400 words, specific and actionable.
+- Do NOT include any other files. Just the one AGENT.md.
+- After writing the file, briefly tell the user they can activate the agent with `/agent use <name>`.
+
+### User's Description
+$ARGUMENTS

code/server/routes.py

@@ -132,6 +132,14 @@ async def homepage():
     except Exception:
         hooks_list = []
 
+    try:
+        from code.agents import list_agents, get_active_agent
+        agents_list = list_agents()
+        active_agent = get_active_agent()
+    except Exception:
+        agents_list = []
+        active_agent = None
+
     config = json.dumps({
         "app_title": APP_TITLE,
         "model_id": MODEL_CONFIGS[DEFAULT_MODEL_KEY]["id"],
@@ -146,6 +154,8 @@ async def homepage():
         "skills": skills_list,
         "commands": commands_list,
         "hooks": hooks_list,
+        "agents": agents_list,
+        "active_agent": active_agent,
     })
     content = content.replace("__RUNTIME_CONFIG__", config)
     return content
@@ -697,10 +707,15 @@ def handle_agent_run(
     skills_json: str = "[]",
     search_enabled: str = "false",
     image_url: str = "",
+    agent_name: str = "",
 ) -> str:
     """Run the Claude Code-style agent loop with tools.
 
     Yields JSON events: status, tool_call, tool_result, streaming, complete, error.
+
+    `agent_name` (optional) overrides the session-active agent for this run.
+    The `/agent use`, `/agent reset`, and `/agent delete` slash commands are
+    intercepted here and dispatched to the agents module before the model runs.
     """
     from code.agent import run_agent
 
@@ -715,6 +730,78 @@ def handle_agent_run(
         })
         return
 
+    # ── Intercept /agent use|reset|delete (session-state mutations) ────
+    # These need to happen server-side BEFORE the model runs so the very
+    # next prompt reflects the change.
+    stripped = prompt.lstrip()
+    if stripped.startswith("/agent ") or stripped == "/agent":
+        from code.agents import (
+            set_active_agent,
+            delete_agent as _delete_agent,
+            list_agents as _list_agents,
+            get_active_agent,
+        )
+        parts = stripped.split(None, 2)  # ["/agent", <sub>, <rest>]
+        sub = parts[1] if len(parts) > 1 else ""
+        arg = parts[2].strip() if len(parts) > 2 else ""
+
+        if sub == "use" and arg:
+            result = set_active_agent(arg)
+            yield json.dumps({
+                "type": "complete",
+                "content": (
+                    f"**Agent activated: `{result.get('active_agent')}`**\n\n"
+                    + (result.get("message", "") if not result.get("success") else "Subsequent prompts will use this agent's persona and tool whitelist.")
+                ),
+                "agent": result.get("active_agent"),
+                "agent_op": "use",
+            })
+            return
+        if sub == "reset" or (sub == "" and arg == ""):
+            result = set_active_agent(None)
+            yield json.dumps({
+                "type": "complete",
+                "content": "**Active agent reset.** Subsequent prompts will use the default SoniCoder persona.",
+                "agent": None,
+                "agent_op": "reset",
+            })
+            return
+        if sub == "delete" and arg:
+            result = _delete_agent(arg)
+            if result.get("success"):
+                yield json.dumps({
+                    "type": "complete",
+                    "content": f"**Agent `{arg}` deleted.**",
+                    "agent": None,
+                    "agent_op": "delete",
+                })
+            else:
+                yield json.dumps({
+                    "type": "error",
+                    "message": result.get("error", f"Failed to delete agent '{arg}'"),
+                    "agent_op": "delete",
+                })
+            return
+        if sub == "list":
+            agents_list = _list_agents()
+            if not agents_list:
+                content = "_No agents available._ Create one with `/agent create <description>`."
+            else:
+                lines = ["| Name | Description | Author | Tools |", "|------|-------------|--------|-------|"]
+                for a in agents_list:
+                    tools = ", ".join(a.get("tools", [])) or "(all)"
+                    active_marker = " **(active)**" if a.get("active") else ""
+                    lines.append(f"| `{a['name']}`{active_marker} | {a.get('description', '')[:80]} | {a.get('author', '')} | {tools} |")
+                content = "\n".join(lines)
+            yield json.dumps({
+                "type": "complete",
+                "content": content,
+                "agents": agents_list,
+                "agent_op": "list",
+            })
+            return
+        # /agent create|show → fall through to the model (handled by slash command expansion)
+
     # Optional web search
     search_context = ""
     if search_enabled.lower() == "true":
@@ -739,6 +826,7 @@ def handle_agent_run(
             skills=skills,
             search_context=search_context,
             image_url=image_url.strip() or None,
+            agent_name=agent_name.strip() or None,
         ):
             yield json.dumps(event, default=str)
     except Exception as exc:
@@ -915,3 +1003,112 @@ def handle_delete_hook(name: str) -> str:
     from code.hooks import delete_hook
     result = delete_hook(name)
     yield json.dumps(result, default=str)
+
+
+# ─── Custom Agent Endpoints ────────────────────────────────────────────
+
+
+@app.api(name="list_agents", concurrency_limit=4)
+def handle_list_agents() -> str:
+    """List all available custom agents (builtins + user)."""
+    from code.agents import list_agents, get_active_agent
+    agents = list_agents()
+    active = get_active_agent()
+    yield json.dumps({
+        "success": True,
+        "agents": agents,
+        "active_agent": active,
+    }, default=str)
+
+
+@app.api(name="get_agent", concurrency_limit=4)
+def handle_get_agent(name: str) -> str:
+    """Get the full definition of a single agent."""
+    from code.agents import get_agent
+    agent = get_agent(name)
+    if not agent:
+        yield json.dumps({"success": False, "error": f"Agent not found: {name}"})
+        return
+    # Strip non-serializable path
+    agent_serializable = {k: v for k, v in agent.items() if k != "path"}
+    yield json.dumps({"success": True, "agent": agent_serializable}, default=str)
+
+
+@app.api(name="save_agent", concurrency_limit=1)
+def handle_save_agent(
+    name: str,
+    description: str,
+    body: str,
+    tools: str = "",
+    skills: str = "",
+    temperature: str = "",
+    max_iterations: str = "",
+    tags: str = "",
+    author: str = "user",
+) -> str:
+    """Create or overwrite a custom agent definition (manual save, no AI).
+
+    `tools`, `skills`, `tags` are comma-separated strings. `temperature` and
+    `max_iterations` are strings that will be parsed if non-empty.
+    """
+    from code.agents import save_agent, ALL_TOOLS
+
+    def _split(s: str) -> list[str]:
+        return [x.strip() for x in (s or "").split(",") if x.strip()]
+
+    tools_list = _split(tools) or list(ALL_TOOLS)
+    skills_list = _split(skills)
+    tags_list = _split(tags)
+
+    temp_val = None
+    if temperature.strip():
+        try:
+            temp_val = float(temperature)
+        except ValueError:
+            yield json.dumps({"success": False, "error": f"Invalid temperature: {temperature}"})
+            return
+
+    iter_val = None
+    if max_iterations.strip():
+        try:
+            iter_val = int(max_iterations)
+        except ValueError:
+            yield json.dumps({"success": False, "error": f"Invalid max_iterations: {max_iterations}"})
+            return
+
+    result = save_agent(
+        name=name,
+        description=description,
+        body=body,
+        tools=tools_list,
+        skills=skills_list,
+        temperature=temp_val,
+        max_iterations=iter_val,
+        tags=tags_list,
+        author=author,
+    )
+    yield json.dumps(result, default=str)
+
+
+@app.api(name="delete_agent", concurrency_limit=1)
+def handle_delete_agent(name: str) -> str:
+    """Delete a user-defined agent by name."""
+    from code.agents import delete_agent
+    result = delete_agent(name)
+    yield json.dumps(result, default=str)
+
+
+@app.api(name="set_active_agent", concurrency_limit=1)
+def handle_set_active_agent(name: str = "") -> str:
+    """Set the active agent for subsequent prompts. Empty string resets."""
+    from code.agents import set_active_agent, list_agents, get_active_agent
+    result = set_active_agent(name.strip() or None)
+    if not result.get("success"):
+        yield json.dumps(result, default=str)
+        return
+    # Return fresh list + active agent so frontend can re-render
+    yield json.dumps({
+        **result,
+        "agents": list_agents(),
+        "active_agent": get_active_agent(),
+    }, default=str)

index.html

@@ -1254,6 +1254,42 @@ body.hide-thinking .think-block { display: none; }
               <button onclick="clearActiveSkills()" style="margin-top:6px;font-size:10px;color:var(--red);background:none;border:1px solid var(--red);padding:2px 8px;cursor:pointer;border-radius:3px;">Clear all</button>
             </div>
 
+            <!-- Custom Agents -->
+            <div class="deploy-field">
+              <label>&#129302; Custom Agents <span id="active-agent-badge" style="display:none;background:var(--purple-dim, #2d1b4e);color:var(--purple, #a855f7);padding:1px 6px;border-radius:3px;font-size:9px;margin-left:6px;border:1px solid var(--purple, #a855f7);">active: <span id="active-agent-name">-</span></span></label>
+              <div id="agents-list" style="display:grid;grid-template-columns:1fr;gap:4px;font-size:11px;"></div>
+              <div class="deploy-hint">
+                Click an agent to activate it. Built-in agents: <code>code-reviewer</code>, <code>test-writer</code>.
+                Or describe a new one in natural language and let the AI generate it:
+              </div>
+              <!-- AI agent creation box -->
+              <div style="margin-top:8px;border:1px dashed var(--border);padding:8px;border-radius:4px;background:var(--bg-code);">
+                <div style="font-size:10px;color:var(--gray-light);margin-bottom:4px;font-weight:600;">&#10024; AI-Generate a Custom Agent</div>
+                <textarea id="agent-create-input" rows="2" placeholder="e.g. 'a security reviewer that audits dependencies and flags hardcoded secrets'" style="width:100%;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:6px;font-family:var(--font-mono);font-size:11px;resize:vertical;"></textarea>
+                <div style="display:flex;gap:6px;margin-top:6px;">
+                  <button onclick="createAgentViaAI()" id="btn-create-agent-ai" style="font-size:10px;background:var(--green);color:#000;border:none;padding:4px 10px;cursor:pointer;border-radius:3px;font-weight:600;">&#10024; Generate via AI</button>
+                  <button onclick="showManualAgentEditor()" style="font-size:10px;background:none;border:1px solid var(--border);padding:3px 10px;cursor:pointer;border-radius:3px;color:var(--gray-light);">Write manually</button>
+                </div>
+              </div>
+              <!-- Manual editor (hidden by default) -->
+              <div id="manual-agent-editor" style="display:none;margin-top:8px;border:1px solid var(--border);padding:8px;border-radius:4px;background:var(--bg-code);">
+                <div style="font-size:10px;color:var(--gray-light);margin-bottom:4px;font-weight:600;">Manual Agent Editor</div>
+                <input type="text" id="agent-name-input" placeholder="name (kebab-case)" style="width:100%;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-family:var(--font-mono);font-size:11px;margin-bottom:4px;">
+                <input type="text" id="agent-desc-input" placeholder="one-line description" style="width:100%;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-size:11px;margin-bottom:4px;">
+                <input type="text" id="agent-tools-input" placeholder="tools (comma-sep, e.g. read_file,grep,bash)" style="width:100%;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-family:var(--font-mono);font-size:11px;margin-bottom:4px;">
+                <input type="text" id="agent-skills-input" placeholder="skills (comma-sep, e.g. code-review)" style="width:100%;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-family:var(--font-mono);font-size:11px;margin-bottom:4px;">
+                <div style="display:flex;gap:4px;margin-bottom:4px;">
+                  <input type="text" id="agent-temp-input" placeholder="temp (0.0-1.0)" style="flex:1;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-size:11px;">
+                  <input type="text" id="agent-iter-input" placeholder="max_iter" style="flex:1;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-size:11px;">
+                </div>
+                <textarea id="agent-body-input" rows="6" placeholder="# My Agent&#10;&#10;Full system-prompt extension here..." style="width:100%;background:var(--bg-input,#0d1117);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:6px;font-family:var(--font-mono);font-size:11px;resize:vertical;margin-bottom:4px;"></textarea>
+                <div style="display:flex;gap:6px;">
+                  <button onclick="saveManualAgent()" style="font-size:10px;background:var(--green);color:#000;border:none;padding:4px 10px;cursor:pointer;border-radius:3px;font-weight:600;">Save agent</button>
+                  <button onclick="hideManualAgentEditor()" style="font-size:10px;background:none;border:1px solid var(--border);padding:3px 10px;cursor:pointer;border-radius:3px;color:var(--gray-light);">Cancel</button>
+                </div>
+              </div>
+            </div>
+
             <!-- Hooks -->
             <div class="deploy-field">
               <label>Hooks (active rules)</label>
@@ -1402,6 +1438,9 @@ const state = {
   agentMode: false,
   activeSkills: [],
   todos: [],
+  // Custom agents
+  activeAgent: null,
+  agentsList: [],
 };
 
 // ═══════════════════════════════════════════════════════
@@ -2288,10 +2327,11 @@ async function callAgentApi(name, data) {
 function toggleAgentMode() {
   state.agentMode = document.getElementById('agent-mode-toggle').checked;
   if (state.agentMode) {
-    addSystemMessage('🤖 Agent mode enabled. The model can now call tools (read_file, write_file, edit_file, bash, etc.) and manipulate the workspace. Slash commands like /commit, /review, /feature are also active.');
-    // Refresh workspace + todos + skills display
+    addSystemMessage('🤖 Agent mode enabled. The model can now call tools (read_file, write_file, edit_file, bash, etc.) and manipulate the workspace. Slash commands like /commit, /review, /feature, /agent are also active.');
+    // Refresh workspace + todos + skills + agents display
     refreshWorkspace();
     refreshTodos();
+    refreshAgents();
   } else {
     addSystemMessage('Agent mode disabled. Back to standard chat mode.');
   }
@@ -2385,6 +2425,201 @@ function renderHooksList() {
   }).join('');
 }
 
+// ═══════════════════════════════════════════════════════
+// CUSTOM AGENTS (AI-generated personas)
+// ═══════════════════════════════════════════════════════
+
+function renderAgentsList() {
+  const container = document.getElementById('agents-list');
+  if (!container) return;
+  const agents = (state.agentsList || CONFIG.agents || []);
+  if (agents.length === 0) {
+    container.innerHTML = '<div style="color:var(--gray-dim);">No agents yet. Describe one above to have the AI generate it, or use <code>/agent create</code> in chat.</div>';
+    return;
+  }
+  container.innerHTML = agents.map(a => {
+    const isActive = state.activeAgent === a.name;
+    const bg = isActive ? 'var(--purple-dim, #2d1b4e)' : 'var(--bg-code)';
+    const color = isActive ? 'var(--purple, #a855f7)' : 'var(--gray-light)';
+    const border = isActive ? 'var(--purple, #a855f7)' : 'var(--border)';
+    const tools = (a.tools || []).slice(0, 4).join(', ') + ((a.tools || []).length > 4 ? '...' : '');
+    const isBuiltin = (a.author === 'builtin');
+    const delBtn = isBuiltin ? '' :
+      `<span style="cursor:pointer;color:var(--red);margin-left:6px;font-size:10px;" onclick="event.stopPropagation();deleteAgent('${a.name}')" title="Delete">x</span>`;
+    return `<div style="padding:6px 8px;background:${bg};color:${color};border:1px solid ${border};border-radius:3px;cursor:pointer;" onclick="activateAgent('${a.name}')">
+      <div style="display:flex;justify-content:space-between;align-items:center;">
+        <span style="font-weight:600;">${isActive ? '★ ' : ''}${a.name} <span style="font-size:9px;color:var(--gray-mid);font-weight:400;">[${a.author || 'user'}]</span></span>
+        ${delBtn}
+      </div>
+      <div style="font-size:10px;color:var(--gray-mid);margin-top:2px;">${(a.description || '').slice(0, 100)}</div>
+      ${tools ? `<div style="font-size:9px;color:var(--gray-dim);margin-top:2px;font-family:var(--font-mono);">tools: ${tools}</div>` : ''}
+    </div>`;
+  }).join('');
+}
+
+function renderActiveAgentBadge() {
+  const badge = document.getElementById('active-agent-badge');
+  const name = document.getElementById('active-agent-name');
+  if (!badge || !name) return;
+  if (state.activeAgent) {
+    badge.style.display = 'inline';
+    name.textContent = state.activeAgent;
+  } else {
+    badge.style.display = 'none';
+    name.textContent = '-';
+  }
+}
+
+async function refreshAgents() {
+  try {
+    const es = await callAgentApi('list_agents', []);
+    es.addEventListener('complete', (e) => {
+      try {
+        const data = JSON.parse(e.data);
+        const result = JSON.parse(data[0]);
+        if (result.success) {
+          state.agentsList = result.agents || [];
+          state.activeAgent = result.active_agent || null;
+          renderAgentsList();
+          renderActiveAgentBadge();
+        }
+      } catch (err) { console.error('Agent refresh error:', err); }
+      es.close();
+    });
+    es.addEventListener('error', () => es.close());
+  } catch (err) { console.error('refreshAgents failed:', err); }
+}
+
+async function activateAgent(name) {
+  try {
+    const es = await callAgentApi('set_active_agent', [name]);
+    es.addEventListener('complete', (e) => {
+      try {
+        const data = JSON.parse(e.data);
+        const result = JSON.parse(data[0]);
+        if (result.success) {
+          state.activeAgent = result.active_agent || name;
+          state.agentsList = result.agents || state.agentsList;
+          renderAgentsList();
+          renderActiveAgentBadge();
+          addSystemMessage(`★ Active agent: ${state.activeAgent}. Subsequent prompts will use this persona and tool whitelist. Use /agent reset to revert.`);
+        } else {
+          addSystemMessage(`Failed to activate agent: ${result.error || 'unknown'}`);
+        }
+      } catch (err) { console.error('Agent activate error:', err); }
+      es.close();
+    });
+    es.addEventListener('error', () => es.close());
+  } catch (err) { console.error('activateAgent failed:', err); }
+}
+
+async function resetAgent() {
+  try {
+    const es = await callAgentApi('set_active_agent', ['']);
+    es.addEventListener('complete', (e) => {
+      try {
+        const data = JSON.parse(e.data);
+        const result = JSON.parse(data[0]);
+        if (result.success) {
+          state.activeAgent = null;
+          renderAgentsList();
+          renderActiveAgentBadge();
+          addSystemMessage('Active agent reset to default SoniCoder.');
+        }
+      } catch (err) { console.error('Agent reset error:', err); }
+      es.close();
+    });
+    es.addEventListener('error', () => es.close());
+  } catch (err) { console.error('resetAgent failed:', err); }
+}
+
+async function deleteAgent(name) {
+  if (!confirm(`Delete agent '${name}'? This cannot be undone.`)) return;
+  try {
+    const es = await callAgentApi('delete_agent', [name]);
+    es.addEventListener('complete', (e) => {
+      try {
+        const data = JSON.parse(e.data);
+        const result = JSON.parse(data[0]);
+        if (result.success) {
+          addSystemMessage(`Agent '${name}' deleted.`);
+          refreshAgents();
+        } else {
+          addSystemMessage(`Failed to delete agent: ${result.error || 'unknown'}`);
+        }
+      } catch (err) { console.error('Agent delete error:', err); }
+      es.close();
+    });
+    es.addEventListener('error', () => es.close());
+  } catch (err) { console.error('deleteAgent failed:', err); }
+}
+
+function showManualAgentEditor() {
+  document.getElementById('manual-agent-editor').style.display = 'block';
+}
+function hideManualAgentEditor() {
+  document.getElementById('manual-agent-editor').style.display = 'none';
+}
+
+async function saveManualAgent() {
+  const name = document.getElementById('agent-name-input').value.trim();
+  const desc = document.getElementById('agent-desc-input').value.trim();
+  const body = document.getElementById('agent-body-input').value.trim();
+  const tools = document.getElementById('agent-tools-input').value.trim();
+  const skills = document.getElementById('agent-skills-input').value.trim();
+  const temp = document.getElementById('agent-temp-input').value.trim();
+  const iter = document.getElementById('agent-iter-input').value.trim();
+  if (!name || !body) {
+    addSystemMessage('Name and body are required to save an agent.');
+    return;
+  }
+  try {
+    const es = await callAgentApi('save_agent', [name, desc, body, tools, skills, temp, iter, '', 'user']);
+    es.addEventListener('complete', (e) => {
+      try {
+        const data = JSON.parse(e.data);
+        const result = JSON.parse(data[0]);
+        if (result.success) {
+          addSystemMessage(`Agent '${name}' saved. Click it in the list (or /agent use ${name}) to activate.`);
+          hideManualAgentEditor();
+          ['agent-name-input','agent-desc-input','agent-body-input','agent-tools-input','agent-skills-input','agent-temp-input','agent-iter-input']
+            .forEach(id => { const el = document.getElementById(id); if (el) el.value = ''; });
+          refreshAgents();
+        } else {
+          addSystemMessage(`Failed to save agent: ${result.error || 'unknown'}`);
+        }
+      } catch (err) { console.error('Agent save error:', err); }
+      es.close();
+    });
+    es.addEventListener('error', () => es.close());
+  } catch (err) { console.error('saveManualAgent failed:', err); }
+}
+
+function createAgentViaAI() {
+  const desc = document.getElementById('agent-create-input').value.trim();
+  if (!desc) {
+    addSystemMessage('Describe the agent you want first.');
+    return;
+  }
+  // Send `/agent create <description>` as a chat prompt — the agent_run
+  // handler routes it through the slash-command expansion + AI generation.
+  const input = document.getElementById('chat-input');
+  if (input) {
+    input.value = `/agent create ${desc}`;
+    // Trigger send via the global handleSend() (defined elsewhere in this file)
+    if (typeof handleSend === 'function') {
+      handleSend();
+    } else {
+      const sendBtn = document.getElementById('btn-send');
+      if (sendBtn) sendBtn.click();
+    }
+  } else {
+    // Fallback: tell user
+    addSystemMessage(`Type this in chat: /agent create ${desc}`);
+  }
+  document.getElementById('agent-create-input').value = '';
+}
+
 async function refreshTodos() {
   try {
     const es = await callAgentApi('todo_read', ['default']);
@@ -2705,12 +2940,16 @@ sendMessage = async function(prompt) {
 
 // Initialize agent UI on page load
 document.addEventListener('DOMContentLoaded', () => {
-  // Render skills/commands/hooks after CONFIG is loaded
+  // Render skills/commands/hooks/agents after CONFIG is loaded
   setTimeout(() => {
     renderSkillsList();
     renderCommandsList();
     renderHooksList();
     renderActiveSkills();
+    // Pull the live agent list + active agent from the backend
+    refreshAgents();
+    renderAgentsList();
+    renderActiveAgentBadge();
   }, 100);
 });