Smear Cursor for Visual Studio Code

Animate the cursor with a smear effect.
A faithful Visual Studio Code port of smear-cursor.nvim by sphamba.

Install Smear Cursor

        

  

Features

• Smear animation driven by the same spring physics as smear-cursor.nvim
• Every smear-cursor.nvim option that makes sense in VS Code, with the same names and defaults
• Vector rendering: smooth edges, a continuous gradient and sub-character particles, where the Neovim plugin has to approximate with block characters
• Follows the theme's cursor color, or any color you pick
• Follows the cursor style, including mode changes made by VSCodeVim and VSCode Neovim
• Optional particles, for when a smear is not enough

🔥 Fire hazard

Installation

From the Marketplace:

1. Open the Extensions view in VS Code (Ctrl+Shift+X / Cmd+Shift+X)
2. Search for Smear Cursor for Visual Studio Code
3. Click Install

Or via Quick Open:

Launch Quick Open (Ctrl+P / Cmd+P), paste the command below, and press Enter:

ext install davellen.smear-cursor-vscode

The smear starts right away. The commands Smear Cursor: Toggle, Smear Cursor: Enable and Smear Cursor: Disable switch it on and off.

[!TIP] The smear looks closest to Neovim with a block cursor: "editor.cursorStyle": "block".

Configuration

All settings live under smearCursor.* and map one-to-one to the smear-cursor.nvim options (snake_case becomes camelCase). Search for Smear Cursor in the Settings UI to browse them with descriptions and ranges.

{
  "smearCursor.stiffness": 0.8,                   // default 0.6   [0, 1]
  "smearCursor.trailingStiffness": 0.6,           // default 0.45  [0, 1]
  "smearCursor.stiffnessInsertMode": 0.7,         // default 0.5   [0, 1]
  "smearCursor.trailingStiffnessInsertMode": 0.7, // default 0.5   [0, 1]
  "smearCursor.damping": 0.95,                    // default 0.85  [0, 1]
  "smearCursor.dampingInsertMode": 0.95,          // default 0.9   [0, 1]
  "smearCursor.distanceStopAnimating": 0.5        // default 0.1   > 0
}

{
  "smearCursor.stiffness": 0.5,
  "smearCursor.trailingStiffness": 0.5
}

{
  "smearCursor.cursorColor": "#ff4000",
  "smearCursor.particlesEnabled": true,
  "smearCursor.stiffness": 0.5,
  "smearCursor.trailingStiffness": 0.2,
  "smearCursor.trailingExponent": 5,
  "smearCursor.damping": 0.6,
  "smearCursor.gradientExponent": 0,
  "smearCursor.neverDrawOverTarget": true,
  "smearCursor.particleSpread": 1,
  "smearCursor.particlesPerSecond": 500,
  "smearCursor.particlesPerLength": 50,
  "smearCursor.particleMaxLifetime": 800,
  "smearCursor.particleMaxInitialVelocity": 20,
  "smearCursor.particleVelocityFromCursor": 0.5,
  "smearCursor.particleDamping": 0.15,
  "smearCursor.particleGravity": -50,
  "smearCursor.minDistanceEmitParticles": 0
}

Colors

smearCursor.cursorColor accepts:

• empty (default): the theme's editorCursor.foreground, which follows theme changes
• a CSS color: #d3cdc3, rgb(211 205 195), orange
• a theme color id: terminal.ansiRed, editorError.foreground
• none: the color of the text under the cursor

smearCursor.cursorColorInsertMode does the same for insert mode and falls back to cursorColor.

Vim modes

With VSCodeVim or VSCode Neovim installed, the cursor style tells the extension the current mode: a block cursor means normal, a line means insert, an underline means replace. Insert mode then uses the *InsertMode parameters, and smearInsertMode / smearReplaceMode apply, as in Neovim. smearCursor.modeDetection controls this.

Differences from smear-cursor.nvim

How it works

The extension API cannot draw over the editor. The smear is the ::before pseudo-element of a text decoration on the cursor cell, absolutely positioned over the smear's bounding box. An SVG mask, regenerated every frame, cuts out the exact smear shape, gradient and particles. The color is a plain background, so theme colors work.

Known limitations:

• The real cursor stays visible: extensions cannot hide it
• With word wrap, smears across wrapped lines are misplaced vertically
• Only the primary cursor is animated
• Wide characters (CJK, some emoji) count as one column

Development

npm install
npm test          # compile and run the unit tests
npm run package   # build a .vsix

Press F5 in VS Code to launch an Extension Development Host with the extension loaded. Every push to main and every pull request builds the .vsix on GitHub Actions. Releases are automatic and follow Conventional Commits: on main, a feat: commit releases a new minor version, fix: or perf: a patch, and a breaking change (feat!: or a BREAKING CHANGE: footer) a major one, with the .vsix attached to the GitHub release. Other types (chore:, docs:, ci:…) do not release. Versions come from the git tags, so package.json needs no manual bump.

Credits

This extension is a port of the original Neovim plugin created by sphamba:

🔗 smear-cursor.nvim on GitHub

The animation code is translated from smear-cursor.nvim, so this extension is released under the same GPL-3.0 license. All credit for the idea and the physics goes to the original author. This extension simply brings that experience to VS Code.