Build a Custom UI for a Copilot Studio Agent using the Microsoft 365 Agents SDK

Copilot Studio gives you a great “out-of-the-box” chat experience in Teams and Microsoft 365 Copilot. But sometimes you need your own UI: your branding, your layout, your telemetry, and your app’s context. So in this post, let’s wire a Copilot Studio agent into a .NET console “custom UI” using the Microsoft 365 Agents SDK client library. This will help you get started when you want to surface Copilot Studio Agents in your own custom UIs.

Scope note: This is for calling a Copilot Studio agent from your own app UI (not the iframe embed).

On a high level, we’ll:

• Publish a Copilot Studio agent and copy its Microsoft 365 Agents SDK connection string.

• Create an Entra app registration with the CopilotStudio.Copilots.Invoke delegated permission.

• Use MSAL to sign in a user and get a token for the Power Platform API audience.

• Call the agent from a lightweight console “chat UI” using Microsoft.Agents.CopilotStudio.Client.

Prereqs

• A published Copilot Studio agent (and access to its settings).

• .NET SDK installed (any modern LTS is fine).

• Entra ID permission to create an app registration

1) Publish Your Agent And Copy The Agents SDK Connection String

In Copilot Studio:

• Open your agent

• Go to Channels → Web app (or Native app)

• Under Microsoft 365 Agents SDK, copy the connection string.

Note: If your agent uses “Authenticate with Microsoft” or “Authenticate manually”, you’ll see the connection string option (and not the iframe embed code). 

2) Create An Entra App Registration For User Interactive Sign-In

In Azure portal:

• Microsoft Entra ID → App registrations → New registration

• Platform: Public client/native (mobile & desktop)

• Redirect URI: http://localhost (HTTP, not HTTPS)

Then add the delegated permission:

• API permissions → Add a permission

• APIs my organization uses → search Power Platform API

• Delegated permissions → CopilotStudio → CopilotStudio.Copilots.Invoke

3) Create The “Custom UI” (A Console Chat)

This is the bare minimum idea:

• sign in the user (MSAL)

• get a token scoped to the Power Platform API audience (the SDK computes this for you)

• start a conversation

• send messages and stream responses back as activities 

Change these values:

• directConnectUrl = copied from Copilot Studio channel page (Microsoft 365 Agents SDK section).

• tenantId, clientId = from your Entra app registration.

Minimal Working Example

Create and run:

Troubleshooting

• 401/403: confirm delegated permission CopilotStudio.Copilots.Invoke is granted (and admin consent if your tenant requires it). 

• Redirect URI mismatch: make sure the app registration has http://localhost for public client. (The sample uses localhost.) 

• No response text: Copilot Studio responses arrive as a stream of activities—log the full activity payload if you suspect you’re filtering out the wrong activity types.

• Power Platform API missing in permissions picker: follow the sample guidance and tenant configuration notes in the repo.

Notes

• The console app is a clean “backend harness” you can keep as-is, then wrap with an HTTP API for your React front-end to call.

• If you need quick embed-only experiences, the iframe approach is simpler, but it’s not the same as a true custom UI.

Wrapping up

This pattern keeps your agent authored in Copilot Studio, while your product team owns the end-user experience in a custom UI. The key pieces are: connection info from Copilot Studio, Entra delegated permission, MSAL sign-in, then stream activities through the SDK client.

Hope this helps!

Getting started: Declarative Agents with TypeSpec for Microsoft 365 Copilot

Declarative agents let you add focused skills to Microsoft 365 Copilot without spinning up servers or long-running code. Compared to Copilot Studio agents (full or Lite), which are great for UI-first orchestration and built-in connectors, declarative agents are repo-friendly, schema-driven artifacts you version, review, and ship like code. 

You describe instructions and capabilities in TypeSpec and the M365 Agents toolkit compiles that into a manifest and handles provisioning.

So in this post, we’ll use the TypeSpec starter in the Microsoft 365 Agents Toolkit and light up a couple of built-in capabilities.

On a high level, we’ll:

• Install the Microsoft 365 Agents Toolkit and TypeSpec bits. 

• Scaffold a Declarative Agent (TypeSpec) project in VS Code. 

• Add capabilities (OneDrive/SharePoint search + People + Code Interpreter). 

• Provision and test the agent from the toolkit.

Prereqs

• Microsoft 365 tenant (Developer or test tenant recommended) and permission to create app registrations.

• Visual Studio Code with Microsoft 365 Agents Toolkit extension. 

• TypeSpec for Microsoft 365 Copilot (installed automatically by the toolkit starter). 

1) Create a TypeSpec Declarative Agent

1. Open VS Code.

2. From the sidebar, open Microsoft 365 Agents Toolkit → Create a New Agent/App → Declarative Agent → Start with TypeSpec for Microsoft 365 Copilot.

3. Name it (e.g., ContosoFinder) and choose the default folder.

4. In the Lifecycle pane, select Provision to create the Azure AD app and resources in your tenant.

2) Understand the project

The starter includes:

• main.tsp (your agent definition)

• Build scripts that compile TypeSpec → agent manifest JSON

• Toolkit tasks for Provision, Deploy, Publish 

3) Add core capabilities in TypeSpec

Open main.tsp and define instructions plus capabilities. Here’s a compact example that enables OneDrive/SharePoint, People, and CodeInterpreter for simple Python math/CSV ops:

Change these values: title, instructions text, conversation starters, search resultLimit, and Code Interpreter timeout as needed. Capability names/params align with the built-in catalog.

4) Build & validate

• In the Agents Toolkit Lifecycle pane: select Provision which will start the build, validate and deploy process.

5) Test in Microsoft 365 Copilot (tenant)

• Once the Provisioning succeeds

• Try prompts like:

  • “Find my last 5 QBR files” → You should see a list of SharePoint/OneDrive files with links.

  • “Who are my peers?” → The agent returns people details from the Graph.

  • “Summarize this CSV and plot top 3 values” → Code Interpreter runs Python and returns a brief summary + chart image. 

Notes

• Prefer built-in capabilities (Search, People, OneDrive/SharePoint, Teams Messages, WebSearch, Code Interpreter) before adding custom APIs. They’re simpler and tenant-aware.

• When you need external systems, add an API plugin to your declarative agent via TypeSpec; plugins are actions inside declarative agents (not standalone in Copilot).

• Great learning paths: the “Build your first declarative agent using TypeSpec” module and recent open labs/samples. 

Wrapping up

With TypeSpec, declarative agents become a clean, versionable artifact you can build, validate, and ship from VS Code. Start with built-in capabilities, keep instructions focused, and only plug external APIs when the scenario demands it. 

Hope this helps!

Enable Code Interpreter in Copilot Studio (Full Version)

Code interpreter in Copilot Studio is a built in runtime that lets Copilot write and run short Python code in a secure sandbox. It can read files that you upload, perform calculations, build charts, transform data, and return the outputs inline or as downloadable files. Typical uses include quick analysis of CSV or Excel data, data cleaning, format conversions, and simple visualizations, all driven by natural language prompts. More information here.

In the full Copilot Studio experience you enable it at the environment level and then turn it on for specific prompts so your agent can choose when to use code for better answers.

So in this post, let’s enable the new Code interpreter capability in the full version of Copilot Studio and use it from a prompt. We’ll keep it small: flip the right admin switch, add a prompt as a tool in an agent, and verify with a quick run. 

This is not about Copilot Studio Lite/Agent Builder (that already exposes a simple toggle), this walkthrough is for the full Copilot Studio experience.

On a high level, we’ll:

1. Turn on Code interpreter for your environment in the Power Platform admin center (PPAC).

2. In Copilot Studio (full), add a Prompt tool to an agent and enable Code interpreter in the prompt’s settings.

3. Test with a couple of natural‑language requests that execute Python under the hood.

Prereqs: You’ll need access to PPAC (or an admin), a Copilot Studio environment, and a Microsoft 365 Copilot or Copilot Studio license in the right tenant. If you see a message like “Code interpreter is disabled for your environment or tenant”, it usually means step 1 wasn’t completed.

1) Enable at the environment level (admin step)

In Power Platform admin center:

1. Go to Copilot → Settings.

2. Under Copilot Studio, open Code generation and execution in Copilot Studio.

3. Select your environment, choose On, and Save.
   
   

That switch unlocks Python‑based execution for prompts and agents in that environment. If you manage multiple environments (Dev/Test/Prod), repeat per environment.

2) Add a prompt to an agent and enable Code interpreter

In Copilot Studio (full):

1. Open your agent → Tools tab → New tool → Prompt.

2. In the prompt editor, select … → Settings.

3. Toggle Enable code interpreter → Save/Close.

Tip: This is easy to miss the toggle lives in the prompt’s Settings, not in the agent’s capabilities. If the toggle is missing or disabled, double‑check step 1 or your permissions.

 

3) A minimal prompt

Create a new prompt with the following Instructions:

You are a helpful assistant that can use Code interpreter when it’s the best tool for the task.

If the user asks to analyze data, perform calculations, transform files, 

or generate charts,

write and run Python code with safe defaults.

Explain what you ran and summarize the output clearly for a non‑technical audience.

Add Inputs:

• question (Text)

Test ideas:

• “Simulate compound growth at 8% for 10 years and plot the curve.”

When you select Test, you should see the system take two passes: first it plans, then it generates and executes Python, returning results (and charts) inline.

Now you can start using this prompt tool just like any other tool in your agent!

Troubleshooting

• Toggle isn’t visible: The prompt’s settings show Code interpreter only when the environment is enabled in PPAC.

• Blocked by policy: Some tenants restrict code execution. Check with your admin if the PPAC toggle is greyed out.

• Host differences: In‑context agents that run inside other hosts may have limitations when Code interpreter is on. Test in your target host early.

• Quotas: Code execution may be subject to usage limits. If runs are throttled, try again later or reduce dataset size.

Notes

• In Copilot Studio Lite / Agent Builder, you’ll find Code interpreter under Configure → Capabilities as a simple toggle. This post focuses on the full Copilot Studio flow, where the setting lives inside each Prompt.

• If you build agents with the Agents Toolkit/VS Code, you can also declare CodeInterpreter in the agent manifest (schema v1.2+). That’s a different path but useful for source‑controlled agents.

Wrapping up

That’s the minimal path: enable at PPAC → toggle in the Prompt settings → test with a simple data task. From here, stitch the prompt into your agent’s flow, pass inputs from variables, and add guardrails (size limits, safe defaults).

Hope this helps!