> ## Documentation Index
> Fetch the complete documentation index at: https://docs.blackbox.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Getting Started

> Step-by-step guide to install and set up the BLACKBOX AI VS Code extension.

## Installation and Setup

Follow these simple steps to get started with BLACKBOX AI in VS Code:

##### **Step 1: Install the Extension**

You can install the BLACKBOX AI extension in two ways:

**Option A: From VS Code**
Open VS Code, navigate to the Extensions view (`Ctrl+Shift+X`), search for "BLACKBOX AI", and click **Install**.

**Option B: From VS Code Marketplace**
Visit the [BLACKBOX AI extension page](https://marketplace.visualstudio.com/items?itemName=Blackboxapp.blackbox) on the VS Code Marketplace and click **Install**.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/icHAl7BWxeja228w/images/vscode-agent/vscode_extension-install_01.png?fit=max&auto=format&n=icHAl7BWxeja228w&q=85&s=e71eb208f891a4b8cb4bfd7401dfb332" alt="BLACKBOX AI Extension" width="3146" height="2110" data-path="images/vscode-agent/vscode_extension-install_01.png" />

##### **Step 2: Find the AI Agent Icon**

After installation, you'll see the AI Agent icon appear on the right side of your VS Code interface.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/5uiT4Wae5cUdFR14/images/vscode-agent/vscode_agent-icon_01.png?fit=max&auto=format&n=5uiT4Wae5cUdFR14&q=85&s=3f1438fab809fd222b2a2d4d2a6be196" alt="AI Agent Icon" width="3118" height="2110" data-path="images/vscode-agent/vscode_agent-icon_01.png" />

##### **Step 3: Connect Your Account**

Click on the AI Agent icon and connect your BLACKBOX AI account to start using the extension.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/K8etx6u3xfbx7f6c/images/vscode-agent/vscode_connect-account_01.png?fit=max&auto=format&n=K8etx6u3xfbx7f6c&q=85&s=3e58586aecba49cc31035e3ac29e3c36" alt="Connect BLACKBOX AI Account" width="1158" height="650" data-path="images/vscode-agent/vscode_connect-account_01.png" />

##### **Step 4: Start Using AI Assistance**

Now you can start giving tasks to the BLACKBOX AI Coding Agent for both new projects and existing project improvements.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/K8etx6u3xfbx7f6c/images/vscode-agent/vscode_agent-in-action_01.png?fit=max&auto=format&n=K8etx6u3xfbx7f6c&q=85&s=1b748dfc46f6afaad831a25102dec85b" alt="VS Code Agent in Action" width="2702" height="1638" data-path="images/vscode-agent/vscode_agent-in-action_01.png" />

##### **Step 5: Customize Your Workspace**

Customize the extension chat window according to your preference by simply dragging it around your VS Code interface. Position it wherever works best for your workflow.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/K8etx6u3xfbx7f6c/images/vscode-agent/vscode_agent-customise-location.gif?s=e5a6e3b2a698063d0dde160ebd4f9d97" alt="Customize Extension Location" width="800" height="489" data-path="images/vscode-agent/vscode_agent-customise-location.gif" />

## Additional Configurations/Customizations

##### Tool Configuration

Tools are ways to enable additional functionality and power to the BLACKBOX agent to perform various development-related tasks. You can control tools by clicking on the controls icon beside the settings button, selecting tools, and toggling any tool on or off.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/M-ae6zRYFEIPjlzz/images/vscode-agent/vscode_agent_tools_menu.png?fit=max&auto=format&n=M-ae6zRYFEIPjlzz&q=85&s=5246c61c229459f24583f6bceccc5468" alt="Browser Tool Selection" width="2450" height="1626" data-path="images/vscode-agent/vscode_agent_tools_menu.png" />

For example, the browser tool allows the agent to launch and control a browser to navigate websites, interact with web elements, capture screenshots, and test web applications in real-time.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/M-ae6zRYFEIPjlzz/images/vscode-agent/vscode_agent_select_browser_tool.png?fit=max&auto=format&n=M-ae6zRYFEIPjlzz&q=85&s=acfa4f6844566a245ce991b2d3039ff3" alt="Browser Tool Selection" width="2908" height="2112" data-path="images/vscode-agent/vscode_agent_select_browser_tool.png" />

##### Fine-Grained Auto-Approval

When you enable **Auto** mode for tool execution, you can still retain control over which operations are auto-approved.\
Open the **Tools** configuration from the chat overflow menu (or the edit icon next to the Auto/Manual toggle) to independently enable or disable auto-approval for:

* Edit file
* Create file
* Command execution
* Read file

These fine-grained settings are only applied while **Auto** mode is on; in **Manual** mode, every tool use requires your explicit approval as usual.

<img src="https://mintcdn.com/blackboxai-3b9e98f8/KIWm-D2TMaHp1Kgn/images/vscode-agent/fine-grained-tool-access_docs.png?fit=max&auto=format&n=KIWm-D2TMaHp1Kgn&q=85&s=530165f6561d67a815574226e04012f3" alt="Fine Grained Auto Approval" width="998" height="1924" data-path="images/vscode-agent/fine-grained-tool-access_docs.png" />

## You're Ready to Go!

With the extension installed and your account connected, you're ready to experience AI-powered development directly in VS Code. The AI agent is now available to help you with any coding task, from creating new projects to improving existing code.