VSCode Extension

The SnippKit VSCode Extension seamlessly integrates SnippKit with Visual Studio Code, allowing you to highlight, save, and sync code snippets to your library without leaving your editor.

Save code blocks, functions, or utility logic directly from your active editor tabs with a single right-click or Command Palette action.

Overview

Switching between your IDE and browser context breaks your focus during active coding sessions.

The SnippKit VSCode extension brings your SnippKit library directly into your editor environment — allowing you to capture snippets, assign titles, and receive instant shareable URLs without leaving VS Code.

Direct App Shortcut

Generate your extension API Key at Developer Settings (/settings/developer) or view the extension landing page at /services/vscode.

Live Interactive Editor Simulation

Below is a live interactive simulation showing code selection, right-click context menu capture, title entry, and automatic cloud saving in VS Code:

Live Simulation — utils.js — Snippkit

JS utils.js×

1234567

export function calculateTotal(price, tax) {

// Calculate final price with tax included

return price + (price * tax);

}

const result = calculateTotal(100, 0.2);

console.log(result);

CopyCtrl+C

Paste

Snippkit: Save Selected Code

Format Document

INPUTSnippet Title

Press Enter to confirm

Snippet Saved

Snippet saved to SnippKit dashboard.

What you can do

With the SnippKit VSCode Extension, you can:

Save Highlighted Code: Select any code lines in VS Code and save them directly to SnippKit.
Right-Click Context Menu: Right-click any selection to access Snippkit: Save Selected Code.
Command Palette Integration: Run Snippkit: Set API Key using Ctrl+Shift+P (or Cmd+Shift+P).
Instant Clipboard Link: Receive automatic URL feedback copied to your clipboard upon saving.
Seamless Cloud Sync: Saved code appears immediately on your web dashboard and mobile views.

Installation & Setup

Quick Links

VSCode Extension Download (/services/vscode) — Download the latest .vsix package.
Developer API Keys (/settings/developer) — Create your API key (sk_live_...).

Step 1: Download VSIX Package

Download the extension package (.vsix) from /services/vscode or the releases repository.

Step 2: Install VSIX in VS Code

Open Visual Studio Code.
Open the Extensions view in the left sidebar (or press Ctrl+Shift+X / Cmd+Shift+X).
Click the ... (More Actions) menu icon at the top-right of the Extensions pane.
Select Install from VSIX....
Choose the downloaded .vsix file to complete installation.

Configuring your API Key

To authorize VS Code to communicate with your SnippKit account:

Open Developer Settings (/settings/developer) in SnippKit and generate an API key (sk_live_...).
Open VS Code Command Palette:
- Windows / Linux: Ctrl + Shift + P
- macOS: Cmd + Shift + P
Type Snippkit: Set API Key and press Enter.
Paste your API key into the input prompt and press Enter.

How to save code from VS Code

Highlight Code: Select any code block, function, or statement inside your active VS Code editor tab.
Right Click Context Menu: Right-click the selection and choose Snippkit: Save Selected Code.
Name Your Snippet: Enter a descriptive title in the top VS Code input prompt bar.
Confirm & Sync: Press Enter. A confirmation toast will confirm that the snippet has been saved to your workspace and copy its link to your clipboard.

Automatic Language Detection

The VS Code extension automatically detects the file language (e.g., JavaScript, Python, Rust, Go) based on your active editor mode.

Chrome Extension — Capture snippets directly from web browsers.
SNiX CLI — Manage and run snippets from the terminal.
Create Snippets — Understand snippet attributes, line limits, and tags.
Developer Settings — Manage account security and API tokens.