WithAI Extension

Turn VS Code into an AI workspace like Claude Cowork. A WYSIWYG markdown editor, Claude Code settings manager, and AI workflow toolkit.

Features

WYSIWYG Markdown Editor

Edit markdown files visually with live preview and rich text formatting. No more switching between raw markdown and preview - see your formatting as you type.

Visual editing - Bold, italic, headings, lists, and more with toolbar or keyboard shortcuts
Live preview - See rendered markdown in real-time as you edit
Table support - Create and edit tables visually
Code blocks - Syntax-highlighted code with proper formatting
GitHub-flavored markdown - Full support for task lists, tables, and extended syntax

Claude Code Settings Manager

Manage Claude Code permissions and behavior through a visual UI instead of editing config files.

Permission groups - Toggle 8 permission categories with risk-level indicators
Visual toggles - Enable/disable web access, file operations, code execution, and more
One-click presets - Apply recommended safe settings instantly
Direct file access - Open CLAUDE.md and settings.json in editor

AI Agent Configuration

Configure your AI coding agent with popular system prompts and skills.

System prompt presets - Add behavior instructions (concise responses, research sources, strict scope, no emojis)
Download agent skills - Easily install popular coding agent skills
Custom templates - Create your own CLAUDE.md templates

Markdown to PDF Conversion

Convert markdown documents to professionally formatted PDFs directly from Claude Code.

Bundled skill - Use /generate-pdf-from-md in Claude Code to convert any markdown file
Professional formatting - Clean typography, proper headings, and page breaks

File Viewer

View PDFs, Word docs, PowerPoint slides, and other files directly in VS Code without leaving your workspace.

Workspace Setup

Automatically configure new workspaces for AI-assisted development.

Auto-creates .claude/CLAUDE.md in new workspaces
Configurable templates - Use custom CLAUDE.md content
Manual command available - Run "WithAI: Setup Workspace" anytime

Installation

From VS Code Marketplace

Open VS Code
Go to Extensions (Cmd/Ctrl + Shift + X)
Search for "WithAI Extension"
Click Install

From VSIX File

Download the .vsix file
Open Command Palette (Cmd/Ctrl + Shift + P)
Type "Extensions: Install from VSIX"
Select the downloaded file

Setting WithAI as Default Markdown Editor

If markdown files don't open in the WYSIWYG editor by default:

Option 1: Right-click method

Right-click any .md file in the Explorer
Select "Open With..."
Choose "WithAI Markdown Editor"
Click "Configure default editor for '.md'..."
Select "WithAI Markdown Editor"

Option 2: Settings method

Open Settings (Cmd/Ctrl + ,)
Search for "workbench.editorAssociations"
Add this to your settings.json:

{
  "workbench.editorAssociations": {
    "*.md": "withai.markdownEditor"
  }
}

Option 3: Quick switch

When viewing any markdown file, click the editor selector in the top-right corner and choose "WithAI Markdown Editor"

Usage

Open Settings Panel

Click the gear icon in the top-right corner of any editor window to open the Claude Code settings panel.

Edit Markdown Files

Open any .md file to use the WYSIWYG editor. Use the toolbar for formatting or keyboard shortcuts:

Bold: Cmd/Ctrl + B
Italic: Cmd/Ctrl + I
Headings: Toolbar dropdown

Configure Permissions

In the settings panel, toggle permission groups:

Web Access (low risk)
Package Management (medium risk)
Code Execution (high risk)
File Operations (medium risk)
Development Tools (medium risk)
Document Processing (medium risk)
Creative Tools (low risk)
Claude Management (medium risk)

Requirements

VS Code 1.85.0 or higher
Claude Code CLI (for settings management features)

About

Built by WithAI Research, Inc.