@enum Variant {
  values: "primary", "ghost";
}

@block Button {
  @param --variant Variant;

  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;

  @if (--variant == "primary") {
    background: #6c2bd9;
    color: white;
  }

  @element Icon {
    margin-right: 8px;
  }
}

📦 Installation

Install the extension from the VS Code Marketplace: open the Extensions view (Ctrl+Shift+X / Cmd+Shift+X) and search for “ECSS — Extended CSS”.

Or via Quick Open (Ctrl+P / Cmd+P):

ext install webeach.ecss-language-support

✨ Features

The extension registers the ecss language for .ecss files, wires up a TextMate grammar for syntax highlighting, and runs the ECSS language server (@ecss/language-service):

• syntax highlighting for .ecss files;
• diagnostics — errors are reported inline;
• hover hints;
• autocompletion of directives, types, and @enum values;
• go-to-definition and find references;
• document symbols (file outline).

👨‍💻 Author

Built and maintained by Ruslan Martynov

Found a bug or have a suggestion? Open an issue or send a pull request.

📄 License

Distributed under the MIT License.