Customizing Agents - Tesslate Studio

Why Customize Agents?

Custom agents let you encode your preferences, frameworks, coding standards, and workflows into a reusable AI assistant. Instead of repeating instructions in every chat, you bake them into the agent’s system prompt and configuration.

Enforce Standards

Ensure consistent coding style, naming conventions, and patterns

Specialize Behavior

Focus the agent on specific frameworks, languages, or domains

Control Tool Access

Restrict which tools the agent can use for security or focus

Share with Others

Publish to the marketplace for your team or the community

What You Can Customize

System Prompt
Agent Type
AI Model
Tool Permissions
Metadata

The core instructions that define agent behavior. This is the single most important customization.

Role definition (what the agent is)
Coding style and standards
Framework and library preferences
Behavioral guidelines and constraints
Dynamic markers for runtime context

Creating a Custom Agent

Method 1: Fork an Existing Agent

The easiest path. Start with a working agent and modify it.

Find an Open-Source Agent

Browse your library or the marketplace for an open-source agent that is close to what you want.

Click Fork

Click the Fork button on the agent detail page. This creates a copy in your library.

Customize the System Prompt

Edit the system prompt to match your preferences. Add your coding standards, framework choices, and behavioral guidelines.

Adjust Tool Access (Optional)

Restrict or customize the tools available to your agent.

Choose a Model (Optional)

Select a different AI model if the default does not suit your needs.

Test and Iterate

Use the agent in a test project. Refine the system prompt based on the results.

Forking is the recommended approach for beginners. You start with a proven system prompt and modify it incrementally.

Method 2: Create from Scratch

Build a fully custom agent.

Open Your Library

Navigate to Library and select the Agents tab.

Create New Agent

Click Create New Agent.

Choose Agent Type

Select the architecture: StreamAgent, IterativeAgent, ReActAgent, or TesslateAgent. This determines how the agent processes requests.

Set Metadata

Enter name, description, icon, and category.

Write System Prompt

Craft the system prompt that defines the agent’s behavior. See the section below for guidance.

Configure Tools

Choose which tools the agent can access. Leave empty for full access, or specify a list.

Select Model

Pick the AI model to power the agent.

Test Thoroughly

Create a test project and try various prompts. Iterate on the system prompt until the agent behaves as expected.

Writing System Prompts

The system prompt is the most critical part of agent customization. It defines the agent’s role, capabilities, constraints, and style.

Prompt Structure

A well-structured system prompt includes five sections:

1. Role Definition

Define who the agent is:

You are an expert React developer specializing in TypeScript,
accessibility, and modern best practices. You build performant,
maintainable user interfaces.

2. Capabilities and Guidelines

What the agent should do and how:

Guidelines:
- Use functional components with hooks
- Implement proper TypeScript types for all props and state
- Follow WCAG 2.1 AA accessibility standards
- Use Tailwind CSS for all styling
- Write semantic HTML with ARIA labels where needed
- Keep components under 200 lines; split larger ones

3. Technology Stack

Specific libraries and preferences:

Technology preferences:
- React 18+ with TypeScript
- Tailwind CSS 3+ (never use inline styles)
- React Hook Form for forms
- Zod for validation
- Lucide React for icons
- React Query for server state

4. Constraints

What NOT to do:

Avoid:
- Class components (always use hooks)
- CSS-in-JS or CSS modules (use Tailwind only)
- Default exports (use named exports)
- Hardcoded values (use constants or environment variables)
- Large monolithic components (split into composable pieces)

5. Dynamic Markers

Runtime placeholders that get substituted automatically:

{mode_instructions}

Current project: {project_name}
Available tools: {tool_list}

Always read files before modifying them.

Available Markers

System prompts support dynamic markers that are replaced at runtime with actual values:

Marker	Replaced With	Example
`{mode}`	Current edit mode	`allow`, `ask`, `plan`
`{mode_instructions}`	Full mode-specific behavior instructions	`[FULL EDIT MODE] You have full access...`
`{project_name}`	Project display name	`My E-Commerce App`
`{project_description}`	Project description	`React e-commerce application`
`{project_path}`	Container project path	`/app`
`{git_branch}`	Current git branch	`feature/auth`
`{tool_list}`	Comma-separated available tools	`read_file, write_file, bash_exec`
`{timestamp}`	Current ISO timestamp	`2025-01-15T10:30:00`
`{user_name}`	User’s display name	`Jane Smith`

Mode Instructions

The {mode_instructions} marker is especially important. It injects behavior-specific instructions based on the current edit mode:

Allow Mode
Ask Mode
Plan Mode

[FULL EDIT MODE]
You have full access to all tools including file modifications
and shell commands. Execute changes directly as needed to
accomplish the user's goals.

[ASK BEFORE EDIT MODE]
You can propose file modifications and shell commands, but they
require user approval. The user will be prompted to approve each
dangerous operation before execution. Read operations proceed
without approval.

[PLAN MODE ACTIVE]
You are in read-only planning mode. You MUST NOT execute any file
modifications or shell commands. Instead, create a detailed
markdown plan explaining what changes you would make. All read
operations are allowed and encouraged for gathering context.

Always include {mode_instructions} in your system prompt. This ensures your agent respects the user’s chosen edit mode regardless of what other instructions say.

Example System Prompts

Tailwind Specialist
Backend API Developer
Full-Stack Builder

You are a React + Tailwind CSS specialist. Your job is to create
beautiful, responsive components using only Tailwind utility classes.

Guidelines:
- Use only Tailwind classes (never inline styles or CSS files)
- Make all components fully responsive (mobile-first)
- Use Tailwind's color palette (e.g., blue-500, gray-100)
- Apply consistent spacing using Tailwind scale
- Include hover, focus, and active states
- Use Tailwind's transition classes for animations

Default color scheme:
- Primary: orange-500
- Background: gray-50
- Text: gray-900
- Border: gray-200

{mode_instructions}

Project: {project_name}
Available tools: {tool_list}

Always read the target file before making changes.

You are a backend API developer specializing in FastAPI and
PostgreSQL.

Guidelines:
1. Use RESTful conventions (GET, POST, PUT, DELETE)
2. Validate all input with Pydantic models
3. Return appropriate HTTP status codes
4. Write comprehensive error messages
5. Include type hints on all functions
6. Use async/await for database operations

Patterns to follow:
- Router files in /routers with clear naming
- Service layer for business logic
- Repository pattern for database access
- Pydantic schemas for request/response

{mode_instructions}

Project: {project_name}

You are a full-stack developer building modern web applications
with React, TypeScript, and Node.js.

Frontend standards:
- React 18+ with TypeScript
- Tailwind CSS for styling
- React Query for server state
- React Hook Form + Zod for forms

Backend standards:
- Express or FastAPI
- PostgreSQL with Prisma or SQLAlchemy
- JWT authentication
- Input validation on all endpoints

Code quality:
- TypeScript strict mode
- Named exports
- Descriptive variable names
- Comments on complex logic
- Error boundaries in React

{mode_instructions}

Project: {project_name}
Branch: {git_branch}

Configuring Tool Access

By default, agents have access to all tools in the global registry. You can restrict this for focused or security-conscious agents.

Restricting to Specific Tools

Specify a tool list to limit what the agent can do:

# Example: Read-only analysis agent
tools = ["read_file", "get_project_info", "todo_read"]

# Example: File-focused agent (no shell access)
tools = ["read_file", "write_file", "patch_file", "multi_edit"]

# Example: Full development agent
tools = ["read_file", "write_file", "patch_file", "multi_edit",
         "bash_exec", "shell_open", "shell_exec", "shell_close"]

Custom Tool Descriptions

You can override tool descriptions and examples for your agent. This helps the LLM understand how the tools should be used in your specific context:

tool_configs = {
    "read_file": {
        "description": "Read React component source code",
        "examples": [
            '{"tool_name": "read_file", "parameters": {"file_path": "src/components/Button.tsx"}}'
        ]
    },
    "bash_exec": {
        "description": "Run npm commands and scripts",
        "examples": [
            '{"tool_name": "bash_exec", "parameters": {"command": "npm test"}}'
        ]
    }
}

Advanced: The Factory Pattern

For advanced users, understanding the factory pattern helps when building integrations or debugging agent creation.

How Agent Creation Works

The create_agent_from_db_model function is the central point for creating agents:

Validates that the agent has a system prompt
Looks up the agent type in AGENT_CLASS_MAP (StreamAgent, IterativeAgent, ReActAgent, TesslateAgent)
Creates a scoped tool registry based on the agent’s tools field (or uses the global registry)
Applies custom tool configurations if specified
Instantiates the correct agent class with the system prompt, tools, and model adapter

Tool Registry Scoping Priority

When the factory creates a tool registry, it follows this priority:

tools_override (highest): A pre-configured registry passed directly (used for view-scoped tools)
agent_model.tools: A list of tool names from the database. The factory creates a scoped registry containing only those tools.
Global registry (lowest): If no tool restriction is specified, the full registry is used.

View-Scoped Tools

Different frontend views provide different tool sets:

Code view: Standard file and shell tools (read_file, write_file, patch_file, bash_exec, etc.)
Graph view: Container management tools (graph_start_container, graph_add_connection, etc.)

This scoping happens automatically based on which view you are using.

Registering Custom Agent Types

For developers extending the platform, new agent types can be registered at runtime:

from orchestrator.app.agent.factory import register_agent_type
from my_plugin import CustomAgent

register_agent_type("CustomAgent", CustomAgent)

After registration, the new type can be used in marketplace agent entries.

Selecting AI Models

For open-source agents, you can choose which LLM powers the agent:

GPT-4
Claude
Qwen
OpenRouter Models

Strengths: Excellent reasoning, strong TypeScript knowledge, good architecture decisionsBest for: Complex features, API integration, business logic, debuggingCost: Higher

Model adapters handle the differences between providers. Tesslate supports OpenAI, Anthropic, and other LLM providers through LiteLLM, which provides a unified interface for all models.

Testing Custom Agents

Create a Test Project

Make a dedicated project for testing. This keeps your real projects safe.

Test Simple Requests

Start with basic tasks: “Create a Button component” or “List all files in src/”

Test Complex Scenarios

Try multi-step tasks: “Add authentication with JWT tokens, including login form, protected routes, and token refresh”

Verify Tool Usage

Check that the agent uses the correct tools and follows your system prompt guidelines.

Test Edge Cases

Try unusual requests to see how the agent handles ambiguity or conflicting instructions.

Iterate on the Prompt

Based on test results, refine your system prompt. Add rules for issues you notice, remove instructions that cause confusion.

What to Check

Follows Guidelines

Does the agent use the libraries and patterns specified in your prompt?

Code Quality

Is the generated code clean, typed, and well-structured?

Consistency

Does the agent produce similar quality across different requests?

Error Handling

Does the agent handle failures gracefully and retry when appropriate?

Publishing to the Marketplace

Share your custom agent with the community:

Polish the Agent

Ensure the system prompt is clear, the agent handles common tasks well, and behavior is consistent.

Write Documentation

Create a detailed description: what the agent does, when to use it, which technologies it specializes in, and example use cases.

Click Publish

Open agent settings and select Publish to Marketplace.

Set Details

Choose a category, add tags, set pricing (Free or Paid), and optionally upload screenshots.

Submit for Review

The Tesslate team reviews for quality and guidelines compliance.

Go Live

Once approved, your agent appears in the marketplace for all users.

Published agents are visible to all Tesslate users. Only publish agents you want to share publicly.

Best Practices

Focus on One Specialty

An agent that does one thing well outperforms a generic one. A “React Form Builder” agent will produce better forms than a “General Purpose Developer” agent.

Always Include Mode Markers

Include {mode_instructions} in every system prompt. This ensures your agent respects edit mode settings, which is critical for user safety.

Scope Tool Access for Security

A documentation agent does not need bash_exec. A read-only analyzer does not need write_file. Restrict tools to what the agent actually needs.

Test with Real Tasks

Do not just test with toy examples. Use your agent for real work and iterate the prompt based on actual results.

Iterate the Prompt

Start simple, add rules as you find issues, and remove instructions that cause confusion or contradictions. Prompt engineering is iterative.

Provide Examples in the Prompt

If you want the agent to follow a specific pattern, include a code example directly in the system prompt. LLMs follow examples more reliably than abstract instructions.

Next Steps

Agent Types

Understand the four agent architectures

Using Agents

Practical guide to prompting and tool calls

Agent Marketplace

Browse and publish agents

AI Agents Overview

Core concepts and architecture

Get Started

Self-Hosting

Core Concepts

Working with Projects

AI Agents

Advanced Features

Developer Guide

Development

​Why Customize Agents?

Enforce Standards

Specialize Behavior

Control Tool Access

Share with Others

​What You Can Customize

​Creating a Custom Agent

​Method 1: Fork an Existing Agent

​Method 2: Create from Scratch

​Writing System Prompts

​Prompt Structure

​Available Markers

​Mode Instructions

​Example System Prompts

​Configuring Tool Access

​Restricting to Specific Tools

​Custom Tool Descriptions

​Advanced: The Factory Pattern

​How Agent Creation Works

​Tool Registry Scoping Priority

​View-Scoped Tools

​Registering Custom Agent Types

​Selecting AI Models

​Testing Custom Agents

​What to Check

Follows Guidelines

Code Quality

Consistency

Error Handling

​Publishing to the Marketplace

​Best Practices

​Next Steps

Agent Types

Using Agents

Agent Marketplace

AI Agents Overview

Why Customize Agents?

What You Can Customize

Creating a Custom Agent

Method 1: Fork an Existing Agent

Method 2: Create from Scratch

Writing System Prompts

Prompt Structure

Available Markers

Mode Instructions

Example System Prompts

Configuring Tool Access

Restricting to Specific Tools

Custom Tool Descriptions

Advanced: The Factory Pattern

How Agent Creation Works

Tool Registry Scoping Priority

View-Scoped Tools

Registering Custom Agent Types

Selecting AI Models

Testing Custom Agents

What to Check

Publishing to the Marketplace

Best Practices

Next Steps