filament/packages/forms/docs/20-code-editor.md

title

title
Code editor

import AutoScreenshot from "@components/AutoScreenshot.astro"

Introduction

The code editor component allows you to write code in a set of common programming languages: HTML, CSS, JavaScript, PHP and JSON.

use Filament\Forms\Components\CodeEditor;

CodeEditor::make('code')

Changing the code editor's language

You may change the language of the code editor using the language() method. The editor supports CSS, HTML, JavaScript, JSON, PHP and plain text. You can open the Filament\Forms\Components\CodeEditor\Enums\CodeEditorLanguage enum class to see the full list. To switch to use JavaScript as the language, you can use the CodeEditorLanguage::Javascript enum value:

use Filament\Forms\Components\CodeEditor;
use Filament\Forms\Components\CodeEditor\Enums\CodeEditorLanguage;

CodeEditor::make('code')
    ->language(CodeEditorLanguage::Javascript)