You can check the answer to this problem on github, where I made a ticket some time ago:

https://github.com/prettier/prettier-vscode/issues/1051


I now have a better solution for using stylelint in VSCode:

I have a better option to use the stylelint, because the stylelint owner have created the official VSCode plugin!

https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint

The plugin works almost out of the box. What you need to do is set up. You can use just settings.json in VSCode. Small example:

"stylelint.config": {
    "rules": {
        "at-rule-name-case": "lower",
        "at-rule-name-space-after": "always-single-line",
        "at-rule-semicolon-newline-after": "always",
    }
}

Do you need a ready-to-use configuration?

No problem - you have to check this

  • https://github.com/stylelint/stylelint-config-standard
  • https://github.com/stylelint/stylelint-config-recommended

Do you need Formatting option (Shift + Alt + F)?

No problem. You can define keybinding for option Fix all auto-fixable problems. For example:

{
    "key": "alt+shift+f",
    "command": "stylelint.executeAutofix",
    "when": "editorTextFocus && editorLangId == 'css'"
},
{
    "key": "alt+shift+f",
    "command": "stylelint.executeAutofix",
    "when": "editorTextFocus && editorLangId == 'scss'"
},
{
    "key": "alt+shift+f",
    "command": "stylelint.executeAutofix",
    "when": "editorTextFocus && editorLangId == 'less'"
}

Remember that not all stylelint options are available for autofixing (but most are)

Answer from kanlukasz on Stack Overflow
🌐
GitHub
github.com › prettier › stylelint-prettier
GitHub - prettier/stylelint-prettier: Stylelint plugin for Prettier formatting · GitHub
Stylelint plugin for Prettier formatting. Contribute to prettier/stylelint-prettier development by creating an account on GitHub.
Starred by 380 users
Forked by 19 users
Languages   JavaScript
🌐
npm
npmjs.com › package › stylelint-config-prettier
stylelint-config-prettier - npm
Turns off all rules that are unnecessary or might conflict with Prettier.. Latest version: 9.0.5, last published: 3 years ago. Start using stylelint-config-prettier in your project by running `npm i stylelint-config-prettier`. There are 835 ...
      » npm install stylelint-config-prettier
    
Published   Feb 10, 2023
Version   9.0.5
Author   Shannon Moeller
🌐
npm
npmjs.com › package › stylelint-prettier
stylelint-prettier - npm
Runs prettier as an stylelint rule. Latest version: 5.0.3, last published: a year ago. Start using stylelint-prettier in your project by running `npm i stylelint-prettier`. There are 514 other projects in the npm registry using stylelint-prettier.
      » npm install stylelint-prettier
    
Published   Jan 27, 2025
Version   5.0.3
Author   Ben Scott
🌐
Medium
medium.com › tbc-engineering › why-and-how-to-lint-like-a-pro-173fc4a73899
Why and How to Lint like a PRO. ESlint + Stylelint + Prettier + Husky +… | by Luka Samkharadze | TBC Engineering | Medium
July 15, 2021 - Use comments to ignore specific files or code sections for ESLint and Stylelint. You can also configure ESlint to lint specific directories only, but use Prettier for everything (You can slowly add more directories to files array) or change the severity of common problems to warn like we did on the entire Stylelint.
🌐
Prettier
prettier.io › docs › integrating-with-linters
Integrating with Linters · Prettier
Linters usually contain not only code quality rules, but also stylistic rules. Most stylistic rules are unnecessary when using Prettier, but worse – they might conflict with Prettier!
🌐
npm
npmjs.com › package › prettier-stylelint
prettier-stylelint - npm
September 25, 2017 - code > prettier > stylelint > formatted code. Latest version: 0.4.2, last published: 8 years ago. Start using prettier-stylelint in your project by running `npm i prettier-stylelint`. There are 57 other projects in the npm registry using prettier-stylelint.
      » npm install prettier-stylelint
    
Published   Sep 25, 2017
Version   0.4.2
Author   Hugo Dias
🌐
GitHub
github.com › prettier › stylelint-config-prettier
GitHub - prettier/stylelint-config-prettier: Turns off all rules that are unnecessary or might conflict with prettier. · GitHub
May 19, 2023 - Turns off all rules that are unnecessary or might conflict with prettier. - prettier/stylelint-config-prettier
Starred by 374 users
Forked by 23 users
Languages   JavaScript 99.2% | CSS 0.8%
🌐
GitHub
github.com › prettier › stylelint-prettier › blob › main › CHANGELOG.md
stylelint-prettier/CHANGELOG.md at main · prettier/stylelint-prettier
Stylelint plugin for Prettier formatting. Contribute to prettier/stylelint-prettier development by creating an account on GitHub.
Author   prettier
Find elsewhere
🌐
GitHub
github.com › hugomrdias › prettier-stylelint
GitHub - hugomrdias/prettier-stylelint: code > prettier > stylelint > formatted code
December 21, 2022 - code > prettier > stylelint > formatted code. Contribute to hugomrdias/prettier-stylelint development by creating an account on GitHub.
Starred by 174 users
Forked by 28 users
Languages   JavaScript 78.6% | CSS 21.4% | JavaScript 78.6% | CSS 21.4%
🌐
Prettier
prettier.io › docs › next › related-projects
Related Projects · Prettier
stylelint-prettier runs Prettier as a stylelint rule and reports differences as individual stylelint issues
🌐
StackShare
stackshare.io › stackups › prettier-vs-stylelint
Stylelint vs Prettier | What are the differences? | StackShare
Prettier - Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
🌐
freeCodeCamp
freecodecamp.org › news › how-to-set-up-eslint-prettier-stylelint-and-lint-staged-in-nextjs
How to Set Up ESLint, Prettier, StyleLint, and lint-staged in Next.js
May 30, 2025 - It doesn't need to have any content ... ESLint (see the final section of this post for an example). Stylelint is a linter for CSS and SCSS stylesheets....
🌐
CSS-Tricks
css-tricks.com › prettier-stylelint-writing-clean-css-keeping-clean-code-two-tool-game
Prettier + Stylelint: Writing Very Clean CSS (Or, Keeping Clean Code is a Two-Tool Game) | CSS-Tricks
October 17, 2017 - Stylelint is exactly that. In fact, in that GIF above show Prettier do it’s thing, you saw some red dots and red outlines in my Sublime Text editor. That wasn’t Prettier showing me what it was going to fix (Prettier displays no errors, it just fixes what it can).
🌐
npm
npmjs.com › package › @stylelint › prettier-config
stylelint/prettier-config
January 15, 2026 - A Stylelint shareable config for Prettier.. Latest version: 4.0.0, last published: 7 days ago. Start using @stylelint/prettier-config in your project by running `npm i @stylelint/prettier-config`. There are 1 other projects in the npm registry using @stylelint/prettier-config.
      » npm install @stylelint/prettier-config
    
Published   Oct 01, 2025
Version   4.0.0
Author   stylelint
🌐
freeCodeCamp
freecodecamp.org › news › integrating-prettier-with-eslint-and-stylelint-99e74fede33f
How to integrate Prettier with ESLint and stylelint
May 18, 2024 - Install prettier-stylelint, which is a tool that formats your CSS/SCSS with Prettier followed by stylelint —-fix.
🌐
Aiimi
aiimi.com › insights › using-eslint-prettier-and-stylelint-for-insightmakers-front-end
Using ESLint, Prettier & Stylelint for front-end code - Aiimi
January 2, 2026 - Prettier: Prettier is an ‘opinionated code formatter’ that supports a wide range of languages and formats them according to a set of defined rules. We use Prettier for HTML exclusively. Stylelint: What ESLint is to JavaScript, Stylelint is to CSS.
🌐
GitHub
github.com › prettier › stylelint-config-prettier-scss
GitHub - prettier/stylelint-config-prettier-scss: Turns off all CSS and SCSS rules that are unnecessary or might conflict with prettier.
Turns off all CSS and SCSS rules that are unnecessary or might conflict with Prettier (extends stylelint-config-prettier).
Starred by 25 users
Forked by 3 users
Languages   JavaScript 98.1% | SCSS 1.9% | JavaScript 98.1% | SCSS 1.9%