📝 Dev

VS Code Snippet Generator

Build a JSON snippet ready to paste into VS Code *.code-snippets files, with prefix, multi-line body and tabstops $1, $2.

Snippet name Prefix (trigger) Description Body (uma linha por linha do snippet)

—

VS Code snippets without broken JSON

You type the same block twenty times a day and you know it should be a snippet, but the file format is fiddly enough to put you off: the body has to be an array with one string per line, and a stray comma makes VS Code ignore the entire file without saying a word. Here you write the body as ordinary text, one line per line, and get back JSON with the array already built and escaped.

About tabstops: $1 and $2 are the Tab stops and $0 is where the cursor lands at the end. The example that loads with the page uses $1 twice on purpose, because repeating a number mirrors it, so you type once and both spots fill in together. Use ${1:name} for a default value, ${1|a,b,c|} for a list of choices, and a backslash before a dollar sign you want to keep literal.

Paste the result into .vscode/name.code-snippets to scope it to one project, or open Snippets: Configure Snippets from the command palette to have it everywhere. One field this page does not emit is scope, which limits a snippet to certain languages; without it, a trigger in a .code-snippets file fires in every file type. The Copy button grabs the whole JSON. Nothing leaves your browser.

Frequently asked questions

Can a snippet have more than one trigger?

In VS Code, yes: prefix accepts an array of strings. This page writes a single trigger, so turn that value into an array after pasting if you want two.

Can I use variables like the date or the file name?

You can. Type $TM_FILENAME, $CURRENT_YEAR or $CLIPBOARD straight into the body; they pass through the generator untouched and VS Code resolves them on insert.

My snippet does not show up. What do I check?

Whether the file sits in .vscode with the .code-snippets extension, whether the JSON parses, and whether the language matches. A snippet inside javascript.json only fires in JS files.

Related Tools

🌐

HTML Preview

Write HTML, CSS and JavaScript and see the rendered result in real time. Isolated sandbox — no code is sent to any server.

📡

HTTP Status Code Lookup

Consulta significado de códigos HTTP de 1xx a 5xx.

📝

.editorconfig Generator

Generate a .editorconfig file with indent_style, charset, end_of_line and trim_trailing_whitespace. Standardizes editors across teams. Everything in your browser.