Exercise 3 - Custom agents

Esta página aún no está disponible en tu idioma.

What are custom agents?

Custom agents in GitHub Copilot allow you to create specialized AI assistants tailored to specific tasks or domains within your development workflow. By defining agents through markdown files in the .github/agents folder of your repository, you can provide Copilot with focused instructions, best practices, coding patterns, and domain-specific knowledge that guide it to perform particular types of work more effectively. Teams can codify their expertise into reusable agents — an accessibility agent that enforces WCAG compliance, a security agent that follows secure coding practices, or a testing agent that maintains consistent test patterns.

Custom agents are defined by markdown files in the .github/agents folder of your project, or globally in ~/.copilot/agents. Each file has YAML frontmatter with at least a name and description, followed by a markdown prompt that defines the agent’s behavior, expertise, and instructions.

Custom agents compared with agent skills

There’s some logical overlap between custom agents and agent skills. Both are primarily defined with markdown files and tell an AI how to perform operations. The cleanest way to separate them: a custom agent is the worker, and skills are tools.

Custom agents have their own context window and are built to orchestrate skills (and even other agents) as part of doing their work. In this lab, the accessibility custom agent reviews and updates the site against accessibility guidelines; as part of that work it could call skills such as a pull-request workflow skill or one that runs and manages tests.

There’s no single “right” way to author a custom agent. As with anything in AI, test and iterate to find what works for your environments and scenarios.

You’ll explore the following with custom agents:

how custom agents are defined.
assigning a task to a custom agent.

Scenario

Tailspin Toys is committed to ensuring their crowdfunding platform is accessible to all users, regardless of their visual abilities or preferences. Recent user feedback has highlighted that some users find the current dark theme difficult to read due to insufficient contrast between text and background colors. To address this accessibility concern, the design team has requested the implementation of a high-contrast mode that users can toggle on and off.

Because accessibility is critical, you want to ensure this is implemented as quickly as possible. You’re going to utilize a custom agent to generate the functionality.

Reviewing the accessibility custom agent

A custom agent has already been created for you for accessibility. Let’s review the contents to understand how it will guide Copilot.

Return to your codespace, then review the accessibility custom agent file:

Open .github/agents/accessibility.md.
Note the YAML frontmatter with the name and description fields.

The frontmatter with name and description is required for custom agents.

From there, scan and review the next sections which highlight:
- Core responsibilities when generating code for an accessible website.
- Best practices for accessibility.
- Code examples for HTML, CSS, and JavaScript.
- A list of common pitfalls and mistakes.

Create and assign an issue

Mission control is the central location for working with all agents for your environment. You can assign tasks to Copilot cloud agent, monitor tasks, and even redirect and provide additional guidance. Let’s start by assigning a task to create the high contrast mode to Copilot.

Navigate to your repository.
Select the issues tab.
Select New issue to open the new issue dialog.
Select Blank issue to create the new issue.
Set the Title to Add high contrast mode to website.

Set the Description to:

We need a high contrast mode for the site. There should be a toggle for high contrast which the user can set. It should store the setting in local storage on the browser.

Select Create to create the issue.
On the right side, select Assign to Copilot to open the assignment dialog.
Select Accessibility agent from the list of custom agents.
Select Assign.
Copilot gets to work on the task in the background!

Summary and next steps

This lesson explored custom agents in GitHub Copilot, specialized AI assistants tailored to specific tasks and domains. With custom agents you can codify your team’s expertise and standards into reusable agents that guide Copilot to perform particular types of work more effectively.

You explored these concepts:

how custom agents are defined.
assigning a task to a custom agent.

With Copilot working on implementing the high contrast mode, we can now turn our attention to monitoring and steering the agent session from mission control.

Resources

← Previous lesson: GitHub Copilot cloud agent	Next lesson: Monitoring and managing agents →