​
Advanced customization

The Code Editor provides direct access to your agent’s underlying code for precise customization beyond natural language descriptions.

​
File structure overview

Directory organization

Incorrect changes can affect functionality. Consider duplicating your agent before making significant modifications.

​
Basic operations

1

Access editor

Click “Code” or “Code Editor” from your agent’s dashboard.
2

Browse files

Use the file tree on the left to select files.
3

Edit code

Make changes in the editor with syntax highlighting.
4

Save work

Click “Save” or press Ctrl+S (Cmd+S on Mac).
5

Test changes

Use “Test Agent” to verify behavior.

​
Common customizations

// Example: Customizing the welcome message in index.tsx
export default function Home() {
  return (
    <div>
      <h1>Hello World</h1>
      <p>Welcome to my application</p>
    </div>
  );
}
Start with small changes and test frequently to ensure your agent continues functioning as expected.