Logo
Docs

Custom AI Assistant Behavior

Learn how to customize the behavior of your AI assistant.

The instructions parameter is the recommended way to customize AI assistant behavior. It will remain compatible with performance optimizations to the CopilotKit platform.

It can be customized for Copilot UI as well as programmatically:

Copilot UI

Copilot UI components implements CopilotChatProps, which accepts an instructions property:

CustomCopilot.tsx
import { CopilotChat, CopilotChatProps } from "@copilotkit/react-ui";
 
const CustomCopilot: React.FC<CopilotChatProps> = () => (
  <CopilotChat
    instructions="You are a helpful assistant specializing in tax preparation. Provide concise and accurate answers to tax-related questions."
    labels={{
      title: "Tax Preparation Assistant",
      initial: "How can I help you with your tax preparation today?",
    }}
  />
);

This approach is not recommended as it may interfere with more advanced optimizations we are experimenting with, but it is available should you need it.

For cases requiring complete control over the system message, you can use the makeSystemMessage function.

Copilot UI

import { CopilotChat } from "@copilotkit/react-ui";
 
const CustomCopilot: React.FC = () => (
  <CopilotChat
    instructions="You are a knowledgeable tax preparation assistant. Provide accurate and concise answers to tax-related questions, guiding users through the tax filing process."
    labels={{
      title: "Tax Preparation Assistant",
      initial: "How can I assist you with your taxes today?",
    }}
    makeSystemMessage={myCustomTaxSystemMessage} 
  />
);

Previous

Custom Look & Feel

Next

Copilot Textarea

On this page

instructions Parameter (Recommended)Copilot UIProgrammatic Control + Headless UICustomize makeSystemMessage (Not Recommended)Copilot UIHeadless UI
Edit on GitHub