# microsoft/vscode-extension-samples **Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/microsoft-vscode-extension-samples).** 10,099 stars · 3,889 forks · TypeScript · MIT ## Links - GitHub: https://github.com/microsoft/vscode-extension-samples - awesome-repositories: https://awesome-repositories.com/repository/microsoft-vscode-extension-samples.md ## Description This repository contains a collection of code examples that demonstrate how to build extensions for Visual Studio Code using its extension API. The samples cover the core patterns for extending the editor, including implementing code actions, completions, snippets, and semantic token highlighting. The examples show how to integrate a language server to provide diagnostics, completions, and hover information, as well as how to register a source control provider with file status and commit operations. Custom task types that run shell commands or scripts are also demonstrated, along with virtual file system mounting that allows the editor to browse and edit files from external sources. The samples extend into user interface customization, covering custom editors and webview panels, notebook output renderers, tree views, status bar items, terminal creation, editor decorations, and color theme definitions. Language-specific editor behaviors such as bracket matching and comment toggling are also included. ## Tags ### Development Tools & Productivity - [Extension API Samples](https://awesome-repositories.com/f/development-tools-productivity/extension-apis/extension-api-samples.md) — Contains code examples demonstrating how to use the Visual Studio Code extension API for building editor extensions. - [Code Action Providers](https://awesome-repositories.com/f/development-tools-productivity/code-action-providers.md) — Offers quick-fix or refactoring actions for diagnostics or selected code in the editor. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Code Completion](https://awesome-repositories.com/f/development-tools-productivity/code-completion.md) — Suggests code completions at the cursor position, including snippets, based on the current context. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Source Control Provider Registrations](https://awesome-repositories.com/f/development-tools-productivity/dynamic-configuration-providers/dynamic-provider-registration/source-control-provider-registrations.md) — Demonstrates registering a source control provider with file status, staging, and commit operations. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Editor Extension Patterns](https://awesome-repositories.com/f/development-tools-productivity/editor-extensions/editor-extension-patterns.md) — Provides sample code for implementing code actions, completions, snippets, and semantic token highlighting. - [Language Server Integrations](https://awesome-repositories.com/f/development-tools-productivity/language-server-integrations.md) — Provides language features like diagnostics, completions, and hover info by communicating with a language server. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Language Server Protocols](https://awesome-repositories.com/f/development-tools-productivity/language-server-protocols.md) — Demonstrates connecting a language server to provide diagnostics, completions, and hover information. - [Language Server Protocol Examples](https://awesome-repositories.com/f/development-tools-productivity/language-server-protocols/language-server-protocol-examples.md) — Provides examples showing how to connect a language server to provide diagnostics, completions, and hover information. - [Version Control Integrations](https://awesome-repositories.com/f/development-tools-productivity/version-control-integrations.md) — Integrates a version control system into VS Code with file status, staging, and commit operations. - [VS Code Extensions](https://awesome-repositories.com/f/development-tools-productivity/vs-code-extensions.md) — Contains examples for building custom extensions for Visual Studio Code to add new features and commands. - [Language-Specific Configurations](https://awesome-repositories.com/f/development-tools-productivity/language-specific-configurations.md) — Defines bracket matching, comment toggling, and other language-specific editor behaviors. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Notebook Rendering Utilities](https://awesome-repositories.com/f/development-tools-productivity/notebook-rendering-utilities.md) — Shows how to render rich output like charts or HTML inside notebook cells using custom renderers. - [Source Control Integration Samples](https://awesome-repositories.com/f/development-tools-productivity/source-control-integration-samples.md) — Demonstrates how to register a source control provider with file status and commit operations. - [Editor Task Providers](https://awesome-repositories.com/f/development-tools-productivity/task-configuration-decorators/task-registration-decorators/editor-task-providers.md) — Provides sample code for registering custom task types that run shell commands or scripts. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Task Provider Examples](https://awesome-repositories.com/f/development-tools-productivity/task-provider-examples.md) — Provides sample implementations for registering custom task types that run shell commands or scripts. - [Editor](https://awesome-repositories.com/f/development-tools-productivity/terminal-automation/editor.md) — Demonstrates registering custom task types and managing integrated terminals for automated workflows. ### User Interface & Experience - [Custom Editor Panels](https://awesome-repositories.com/f/user-interface-experience/text-editors/editor-interface-customizations/custom-editor-panels.md) — Provides examples for creating custom editors and webview panels with tailored interactive interfaces. - [Custom Color Theme Definitions](https://awesome-repositories.com/f/user-interface-experience/color-themes/custom-color-theme-definitions.md) — Define a set of colors that change the overall appearance of the editor and its user interface. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Snippet Insertions](https://awesome-repositories.com/f/user-interface-experience/developer-tooling-ui-components/snippet-insertions.md) — Inserts predefined code templates triggered by a prefix in the editor. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Status Bar Customizers](https://awesome-repositories.com/f/user-interface-experience/status-bars/status-bar-customizers.md) — Display a custom icon or text in the status bar to show extension state or trigger actions. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Semantic Highlighters](https://awesome-repositories.com/f/user-interface-experience/styling-theming-systems/content-styling/styling-markup/code-highlighting/semantic-highlighters.md) — Colors code tokens based on their semantic meaning, such as types, functions, or variables. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Editor Text Decorators](https://awesome-repositories.com/f/user-interface-experience/text-highlighting/editor-text-decorators.md) — Apply colored highlights, underlines, or icons to specific text ranges in the editor. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) - [Tree Views](https://awesome-repositories.com/f/user-interface-experience/tree-views.md) — Show a hierarchical data tree in the sidebar using a data provider and a view container. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) ### Data & Databases - [Editor](https://awesome-repositories.com/f/data-databases/virtual-file-systems/editor.md) — Shows how to mount a virtual file system so the editor can browse and edit files from any source. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md)) ### Operating Systems & Systems Programming - [Integrated Editor Terminals](https://awesome-repositories.com/f/operating-systems-systems-programming/terminal-emulators/integrated-editor-terminals.md) — Create and manage an integrated terminal instance within the editor workspace. ([source](https://cdn.jsdelivr.net/gh/microsoft/vscode-extension-samples@main/README.md))