Skip to content
| Marketplace
Sign in
Visual Studio Code>Formatters>CSS AlphabetizeNew to Visual Studio Code? Get it now.
CSS Alphabetize

CSS Alphabetize

Polymer Mallard

|
14,507 installs
| (7) | Free
Alphabetizes the properties of CSS structures.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

CSS Alphabetize

Visual Studio Marketplace Version Visual Studio Marketplace Installs Backers on Patreon Backers on Paypal

Alphabetizes properties within your CSS/SASS files.

CSS Alphabetize example

Usage

Defaults to alphabetizing the entire file's properties, but can also isolate to selections. If you want to alphabetize a selection, make sure you select an entire block. e.g.

div {
    color: red;
    background: blue;
}

Rather than:

    color: red;
    background: blue;

Configuration

You can adjust the brackets to use this plugin more generically. It defaults to curly braces { / } but could be adjusted to anything you want deemed as an opening / closing.

Key Bindings

shift+alt+a will alphabetize your file / selection

Release Notes

0.4.1

  • Keep cursor on same line when alphabetizing

0.4.0

  • Sort @include for SCSS
  • Ignore three types of comment blocks when sorting CSS

0.3.1

  • Sort margin before margin-left

0.3.0

  • Fix issue #4 about media queries
  • Fix incorrect sorting of background urls
  • Remove extra spaces between nested blocks
  • Trim empty line space
  • Add another command "CSS Sort Properties"

0.2.0

  • Break out functions into individual files
  • Add a couple tests
  • Fixes for superfluous line additions
  • Fixe for direct descendant in SASS blocks
  • Changed replacement marker to shebang

0.1.1

Update icon + key command in README

0.0.1

Initial creation of CSS Alphabetize

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft