Skip to main content
The interactive settings editor provides a user-friendly interface for configuring Ghostty without manually editing config files. All changes generate valid Ghostty configuration that can be copied directly into your config file.

​
Overview

The settings editor organizes configuration options into logical panels:

Application

General app behavior, startup commands, quick terminal, and shell integration

Clipboard

Clipboard permissions, copy-on-select, and paste protection

Window

Window appearance, sizing, padding, decorations, and split behavior

Colors

Themes, color palette, cursor colors, and selection colors

Fonts

Font families, sizes, styles, variations, and advanced cell adjustments

Keybinds

Custom keybinding editor with validation and duplicate detection

Mouse

Mouse reporting, scroll multiplier, click actions, and focus behavior

GTK

GTK-specific settings for Linux (titlebar, tabs, CSS)

macOS

macOS-specific settings (fullscreen, titlebar, icon, auto-update)

Linux

Linux-specific settings (async backend, cgroups)

​
Setting Types

The editor provides different control types based on the setting:

​
Switch

Boolean settings with toggle controls: 
window-vsync = true
clipboard-trim-trailing-spaces = false

​
Text Input

Free-form text for paths, commands, and string values: 
title = My Terminal
font-family = JetBrains Mono
config-file = ~/.config/ghostty/custom

​
Number

Numeric settings with sliders or input fields: 
font-size = 13
background-opacity = 0.95
scrollback-limit = 10000000
Predefined options for enumerated values: 
cursor-style = block
window-theme = auto
shell-integration = detect

​
Color Picker

Visual color selection with hex output: 
background = #282c34
foreground = #ffffff
cursor-color = #528bff

​
Theme Browser

Special dropdown that loads community themes from the iTerm2-Color-Schemes repository. Selecting a theme automatically fetches and applies the full color scheme.

​
Groups and Organization

Settings are organized into collapsible groups within each panel: 
interface Panel {
  id: string;
  name: string;
  groups: Group[];
}

interface Group {
  id: string;
  name: string;
  note?: string;  // Additional context for the group
  settings: Setting[];
}
Each group can include a note field that provides context about the settings it contains. For example, the “Advanced” group warns:
You should only touch these settings if you know what you’re doing, otherwise you could cause major issues with Ghostty!

​
Real-Time Previews

Many panels include live preview components that update as you change settings:
  • Cursor preview (colors/cursor/56:1) - Shows cursor style, color, opacity, and blink behavior
  • Font preview (fonts/76:1) - Displays sample text with current font settings
  • Color preview (colors/base/344:1) - Terminal output with selection highlighting
  • App icon preview (macos/icon/167:1) - Shows macOS app icon with custom colors

​
Configuration Export

The editor generates a complete Ghostty config file that you can:
  1. Copy to clipboard - One-click copy of all settings
  2. Download as file - Save as config file
  3. View diff - See only changed settings

​
Example Generated Output

# Application
title = My Custom Terminal
desktop-notifications = true
config-default-files = true

# Window
window-theme = ghostty
window-padding-x = 4
window-padding-y = 4
background-opacity = 0.95

# Colors
background = #1e1e2e
foreground = #cdd6f4
selection-background = #585b70
selection-foreground = #cdd6f4

# Fonts
font-family = JetBrains Mono
font-size = 14
font-thicken = true

# Keybinds
keybind = super+t=new_tab
keybind = super+w=close_surface
keybind = super+enter=toggle_fullscreen

​
Settings Structure

The settings are defined in src/lib/data/settings.ts as a typed array of panels: 
const settings = [
  {
    id: "application",
    name: "Application",
    groups: [
      {
        id: "general",
        name: "",
        settings: [
          {
            id: "title",
            name: "Static title for all windows",
            type: "text",
            value: ""
          },
          {
            id: "desktopNotifications",
            name: "Allow desktop notifications",
            type: "switch",
            value: true
          }
        ]
      }
    ]
  }
] as Panel[];

​
Validation and Defaults

The editor provides:
  • Type validation - Ensures correct value types (numbers, booleans, strings)
  • Range validation - Enforces min/max values for numeric settings
  • Default values - Easy reset to Ghostty defaults
  • Help text - Contextual notes for complex settings
Changing settings in the web UI does not modify your actual Ghostty configuration. You must copy the generated config to your Ghostty config file (~/.config/ghostty/config on Linux/macOS).

Color Schemes

Browse and preview community color themes

Font Playground

Test fonts with live preview

Keybind Builder

Visual keybinding editor with validation

Live Previews

Real-time preview components

Build docs developers (and LLMs) love

Get started for freeTalk to us