Skip to content
| Marketplace
Sign in
Visual Studio Code>Snippets>Microsoft Graph EssentialsNew to Visual Studio Code? Get it now.
Microsoft Graph Essentials

Microsoft Graph Essentials

Preview

Elio Struyf

|
5,636 installs
| (0) | Free
The Microsoft Graph Essentials extension helps you developing with the Microsoft Graph Toolkit & API.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Microsoft Graph Essentials

Microsoft Graph Essentials - Visual Studio Code Extension

Visual Studio Marketplace Number of installs Ratings

The Microsoft Graph Essentials extension helps you developing with the Microsoft Graph Toolkit & API.

Autocompletion for CSS variables and HTML attributes

The extension gives you autocompletion for all the CSS variables and HTML web component attributes.

The CSS variables are used to customize the styling of the MGT web components.

Example:

mgt-person {
  --person-card-display-name-font-size: 40px;
  --person-card-display-name-color: #ffffff;
  --person-card-title-font-size: 20px;
}

Using is as simple as starting to type --, and the extension will show you all the options.

The HTML attributes suggestions will automatically appear when using any of the mgt components in HTML files.

Commands

Currently the extension has the following commands you can use:

  • MS Graph: Open API documentation site (msgraph.essentials.openDocs)
  • MS Graph: Open Graph Explorer site (msgraph.essentials.openGraphExplorer)

Snippets

React

Snippet Purpose
mgt-react-tmp Create a new MGT React template component.

HTML

Snippets to insert the MGT web component in HTML:

Snippet
mgt-agenda
mgt-login
mgt-people
mgt-people-picker
mgt-person
mgt-person-card
mgt-tasks
mgt-teams-channel-picker

CSS

Snippets to quickly modify the component styles:

Snippet
mgt-agenda
mgt-login
mgt-people
mgt-people-picker
mgt-person
mgt-person-card
mgt-tasks
mgt-teams-channel-picker

Changelog

See the changelog for the latest changes.

Feedback and snippet ideas

Feedback and/or ideas are always welcome. Please submit them via creating an issue in the extension repository: issue list.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft