IconVault logoIconVault
Sign in

Prettier Config Generator - Free Online Code Tool | IconVault

Build a .prettierrc visually with toggles and sliders, watch a live sample reformat itself, then copy or download the JSON. Free, in your browser.

All tools

Prettier Config Generator

Build a .prettierrc visually with live code preview

5 of 5 free uses left
printWidth100
tabWidth2

Live sample - watch the code change

A demonstrator applies your settings to a real snippet, including printWidth wrapping of the long call below.

const user = { name: "Ada", role: "admin" };
const tags = [
  "javascript",
  "typescript",
  "react",
];
const greet = (user) => "Hello, " + user.name;

notifySubscribersWithAVeryLongName("ada@example.com", { role: "admin" });  // fits within printWidth 100

.prettierrc - live preview

{
  "printWidth": 100,
  "tabWidth": 2,
  "useTabs": false,
  "semi": true,
  "singleQuote": false,
  "trailingComma": "all",
  "bracketSpacing": true,
  "arrowParens": "always",
  "endOfLine": "lf"
}

5 of 5 free copies left. Everything runs in your browser, nothing is uploaded.

About this tool

IconVault's Prettier Config Generator builds a .prettierrc file without touching JSON by hand. Toggle options like semi, singleQuote, useTabs and bracketSpacing, drag sliders for printWidth and tabWidth, and pick trailingComma, arrowParens and endOfLine from dropdowns. A live JSON preview updates as you click, and a sample code snippet re-formats itself so you can see exactly what each setting does before you commit.

It is free and runs fully in your browser, so your preferences never leave the page. The honest limit: the sample snippet is a demonstration, not a real Prettier run, so edge cases may format slightly differently in the actual formatter. When you are happy, copy the JSON or download it as `.prettierrc` and drop it into your project root.

Frequently asked questions

Popular searches

prettier config generatorprettierrc generatorprettier configgenerate prettierrcprettierrc fileprettierrc exampleprettier configurationprettier settingsprettier optionsprettier printwidthprettier tabwidthprettier singlequoteprettier semiprettier trailing commaprettier bracket spacingprettier arrow parensprettier endoflineprettier use tabsprettierrc jsoncreate prettierrcprettierrc templateprettierrc best practicesprettierrc recommended settingsprettier config onlineprettier config visualprettier config builderprettier playground configformat code prettier configjavascript formatter configtypescript formatter configcode formatter settingsvscode prettier configprettier setup guidehow to configure prettierprettierrc explainedprettier options explainedprintwidth 80 vs 100prettier single quote vs doubleprettier semicolons yes or noprettier config for reactprettier config for nodeprettier config for nextjseslint prettier configprettier editorconfigprettierrc vs prettier config jsdownload prettierrccopy prettier configfree prettier toolonline prettier config toolprettier visual editorprettier settings ui

More tools

Code Playground

Write HTML, CSS & JS with live preview.

JSON Formatter

Beautify, validate & minify JSON.

Base64 Encoder

Encode & decode text and files.

JWT Decoder

Inspect tokens without sending them anywhere.

Coming soon

CLI

Coming soon

Figma plugin

Coming soon

VS Code extension

Coming soon

Chrome extension

Coming soon

AI icon generator

Coming soon

Team workspaces

Coming soon

View all 10+ tools →