adding-editor-adornments

Create in-editor adornments for Visual Studio extensions using VSSDK and MEF exports.

14|2|Updated Mar 24, 2026
One-click install
npx skills add https://github.com/madskristensen/vs-agent-plugins --skill adding-editor-adornments
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: adding-editor-adornments
Source: https://github.com/madskristensen/vs-agent-plugins/tree/main/skills/adding-editor-adornments
Command: npx skills add https://github.com/madskristensen/vs-agent-plugins --skill adding-editor-adornments

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Adornments provide a way to render WPF UI elements directly on the Visual Studio text editor, enabling visual highlights, overlays, and inline decorations that reflect code state or metadata.

Core Features & Use Cases

  • Render editor adornments using the VSSDK in-process model via IWpfTextViewCreationListener and AdornmentLayer, enabling fast, integrated visuals on the code surface.
  • Create viewport-relative overlays or text-relative decorations to highlight specific code regions, display icons, or render custom visuals without modifying the source text.
  • Combine MEF-based components with proper asset declarations in the .vsixmanifest to ensure reliable loading and lifecycle management.

Quick Start

Open your Visual Studio extension project and implement an IWpfTextViewCreationListener to attach and render an adornment on the editor.

Frequently Asked Questions about adding-editor-adornments

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add editor adornments to a Visual Studio extension?

To add editor adornments to a Visual Studio extension, implement an IWpfTextViewCreationListener and use an AdornmentLayer to render WPF UI elements directly on the text editor surface. Use MEF exports to attach the adornments.

What is the difference between viewport-relative and text-relative adornments in Visual Studio?

Viewport-relative adornments in Visual Studio overlay fixed positions on the editor screen, while text-relative adornments anchor to specific code regions and move with the text. Both are rendered using the AdornmentLayer without modifying source text.

How do I handle view changes when rendering VSSDK editor adornments?

To handle view changes when rendering VSSDK editor adornments, handle LayoutChanged events to redraw the WPF visuals whenever the text view updates. This ensures performance-conscious synchronization of overlays with the editor state.

Do I need MEF asset type declarations in the vsixmanifest for editor adornments?

Yes, you need MEF asset type declarations in the .vsixmanifest for editor adornments to ensure reliable loading and lifecycle management. Combining MEF-based components with proper asset declarations enables the VSSDK to correctly register and activate the adornment.

Can I highlight specific code regions in Visual Studio without modifying the source text?

You can highlight specific code regions in Visual Studio without modifying the source text by creating text-relative editor adornments. This technique uses the AdornmentLayerDefinition to render visual highlights and inline decorations over the existing code.

Why are my Visual Studio in-process editor adornments not loading?

Visual Studio in-process editor adornments may fail to load if the MEF asset type is not properly declared in the .vsixmanifest. Ensure your IWpfTextViewCreationListener uses correct MEF exports for reliable lifecycle management.