Skip to main content
You are currently viewing the documentation for Filament 4.x, which is a previous version of Filament.Looking for the current stable version? Visit the 5.x documentation.

​
Introduction

The code editor component allows you to write code in a textarea with line numbers. By default, no syntax highlighting is applied. 
use Filament\Forms\Components\CodeEditor;

CodeEditor::make('code')

​
Using language syntax highlighting

You may change the language syntax highlighting of the code editor using the language() method. The editor supports the following languages:
  • C++
  • CSS
  • Go
  • HTML
  • Java
  • JavaScript
  • JSON
  • Markdown
  • PHP
  • Python
  • SQL
  • XML
  • YAML
You can open the Filament\Forms\Components\CodeEditor\Enums\Language enum class to see this list. To switch to using JavaScript syntax highlighting, you can use the Language::JavaScript enum value: 
use Filament\Forms\Components\CodeEditor;
use Filament\Forms\Components\CodeEditor\Enums\Language;

CodeEditor::make('code')
    ->language(Language::JavaScript)

​
Allowing lines to wrap

By default, long lines in the code editor will create a horizontal scrollbar. If you would like to allow long lines to wrap instead, you may use the wrap() method: 
use Filament\Forms\Components\CodeEditor;

CodeEditor::make('code')
    ->wrap()