Blade

zed-laravel-blade

Laravel Blade templating language support for Zed.

[!Important] Add this in your zed setting to automatically select Blade mode for .blade.php files instead of php.

"file_types": {
  "Blade": ["*.blade.php"]
}

Features

• Syntax highlighting for all Blade directives (conditionals, loops, sections, stacks, inline directives, keywords, attribute directives, Envoy, Livewire)
• Code folding for @if/@foreach/@section/@switch and all block directives
• Outline panel with section names, conditionals, loops, HTML elements
• Language injections: PHP, JavaScript, CSS, Alpine.js, Livewire attributes
• Auto-indentation for Blade blocks and HTML
• Bracket matching and tag auto-close
• Tailwind CSS IntelliSense opt-in
• Prettier support via @shufo/prettier-plugin-blade (currently broken — see zed#42796)

Tailwind CSS IntelliSense

Zed's built-in Tailwind CSS language server is not attached to Blade files by default. Add the following to your Zed settings.json to enable Tailwind class completions in Blade templates:

{
  "languages": {
    "Blade": {
      "language_servers": [
        "tailwindcss-language-server",
        "..."
      ]
    }
  },
  "lsp": {
    "tailwindcss-language-server": {
      "settings": {
        "includeLanguages": {
          "blade": "html"
        }
      }
    }
  }
}

The "..." entry preserves the other language servers configured for Blade.

Formatting

Install blade-formatter globally:

npm install -g blade-formatter

Then add to your Zed settings:

{
  "languages": {
    "Blade": {
      "formatter": {
        "external": {
          "command": "blade-formatter",
          "arguments": ["--stdin"]
        }
      },
      "format_on_save": "on"
    }
  }
}

Optionally, create .bladeformatterrc.json in your project root to configure formatting:

{
  "indentSize": 2,
  "wrapLineLength": 120
}

Note: Config keys must be camelCase (e.g. indentSize), not kebab-case. The CLI flags use --indent-size, but the JSON config file uses indentSize.

Grammar

• tree-sitter-blade

Language Servers

This extension does not bundle any language servers. Install version 0.5.4 or newer of the PHP extension to use PHPantom, Intelephense, PhpTools, or Phpactor in Blade files without downloading or running duplicate PHP server adapters.

For abbreviations, install the official Emmet extension, which supports Blade directly.

Zed enables every registered server included by "...". Select one PHP server and explicitly disable the others. For example, to use Intelephense:

{
  "languages": {
    "Blade": {
      "language_servers": [
        "intelephense",
        "!phpantom",
        "!phpactor",
        "!phptools",
        "..."
      ]
    }
  }
}

Replace intelephense with your preferred PHP server and adjust the disabled entries accordingly. The "..." entry keeps complementary servers such as Emmet, Tailwind CSS, and typo checkers enabled.