Alt Text Generator AI

This extension generates alt text for images using AI. Perfect for improving accessibility and SEO in your web projects.

Features

🤖 AI-Powered: Uses advanced AI to generate descriptive, SEO-optimized alt text
🖼️ Multiple Input Methods:
- Command palette - Enter image URL directly
- Editor selection - Select image URL or tag in code
- File explorer - Right-click on image files
🔧 Smart Processing:
- Automatically detects HTML <img> tags and React/Next.js <Image> components
- Supports local files, relative paths, and URLs
- Automatically resizes large images to prevent payload errors
🌍 Multi-language Support: Generate alt text in multiple languages

Usage

Method 1: Command Palette

Press Cmd+Shift+P (Mac) or Ctrl+Shift+P (Windows)
Type "Generate Alt-Text"
Enter the image URL when prompted
Alt text is generated and copied to clipboard

Method 2: Editor Selection

Select an image URL or image tag in your code
Press Cmd+Shift+P → "Generate Alt-Text"
If it's an image tag, the alt attribute is automatically added/updated
If it's just a URL, alt text is copied to clipboard

Method 3: File Explorer

Right-click on an image file in VS Code's file explorer
Select "Generate Alt Text"
Alt text is generated and copied to clipboard

Setup

Install the extension from VS Code Marketplace
Set your API key:
- Press Cmd+Shift+P → "Alt Text Generator: Set API Key"
- Or go to Settings → Search "Alt Text Generator" → Enter API key
Get your API key from alttextgeneratorai.com

Example

Before:

<img src="https://github.com/balt1794/alt-text-generator-visual-studio/raw/HEAD/photo.jpg">

After:

<img src="https://github.com/balt1794/alt-text-generator-visual-studio/raw/HEAD/photo.jpg" alt="A beautiful sunset over the ocean with orange and pink hues">

Requirements

VS Code 1.74.0 or higher
API key
Node.js (for Sharp library - automatically bundled)

Development

npm install
npm run compile

Press F5 to run the extension in a new Extension Development Host window.

License

MIT