Getting Started

Installation

From VS Code Marketplace (Recommended)

1. Open VS Code
2. Click the Extensions icon in the sidebar (or press ⌘⇧X on macOS, Ctrl+Shift+X on Windows/Linux)
3. Search for "Plainwind"
4. Click Install

That's it. You're ready to go.

From Command Line

If you prefer the terminal:

code --install-extension plainwind

Quick Settings

Click Plainwind in the status bar (bottom right) to quickly access the options menu:

The options menu provides quick access to:

• Display Mode - Switch between CodeLens, Hover, or Off
• Truncation Length - Adjust when translations get truncated with "..."
• Category Grouping - Organize translations by type (Layout, Spacing, etc.)
• Category Emojis - Add visual category indicators
• Visual Enhancements - Show color swatches and font previews in detail panels
• Toggle for This File - Enable/disable for current file only
• Clear All Panels - Close all open translation panels
• Enable/Disable Extension - Toggle Plainwind globally

Command Palette

You can also press ⌘⇧P (macOS) or Ctrl+Shift+P (Windows/Linux), then search for "Plainwind" to access all commands.

Supported Files

Plainwind works automatically in JavaScript, TypeScript, React, HTML, Vue, Svelte, and Angular files.

Next Steps

• Features to learn about conditional detection, display modes, and detail panels
• Configuration to customize settings and keyboard shortcuts
• Framework Support for examples in React, Vue, Svelte, Angular, and Solid