Context & Making Edits

Once we have some code, we can make targeted changes using a few different techniques. Here's how to add context to your Copilot chat:

Ghost text — as you type in the editor, Copilot suggests completions inline. Just start typing (like the word button), and it'll suggest what comes next. Press Tab to accept.

Highlighting code — select lines in the editor and they'll automatically be pinned as context in the chat window. Then just ask Copilot to refactor, explain, or modify that specific code.

Click the “pin” icon to add it as context

✏️ Explore the code:
1. Highlight the new code Copilot wrote
2. Prompt:
Change the border to be blue and dashed

Drag and drop files — you can drag files from your file system directly into the chat to add them as context. This works for code files and images, too.

✏️ Add context
Drag-and-drop the Home page’s test file from the codebase into the chat
Prompt:
What tests do we have for the Home page?

The + button — another way to attach files or images to the chat without drag-and-drop.

The more targeted and specific the context you give Copilot, the more precise its edits will be.

Next: History & Checkpoints