javascript

Tinted — то, из‑за чего ты захочешь использовать терминал

  • вторник, 18 августа 2026 г. в 00:00:03
https://habr.com/ru/articles/1071228/

Введение

Всем привет! Меня зовут Илья, я frontend‑разработчик.
Но сегодня хочу поговорить не о JavaScript, а о терминале.

Несмотря на то, что я уже много лет работаю разработчиком, активно пользоваться терминалом я начал всего около года назад. До этого терминал для меня был просто местом, где запускается сборка проекта, немного Git и иногда еще пара команд. Думаю, у многих так же.

Обычно мысли о терминале вызывают ступор. Кажется, что это что‑то непонятное, черно‑зеленое и предназначенное только для «настоящих программистов», и на практике большинство ограничивается npm run dev, git status и на этом все.

В этом гайде я хочу показать, как можно превратить терминал в красивую и удобную среду разработки, которая не уступает IDEA и другим редакторам. Сразу оговорюсь: речь пойдет исключительно о терминале, а не о NeoVim. NeoVim — это отдельная большая тема.


Что вообще такое терминал?

Чтобы было проще понимать, что мы будем настраивать дальше, сначала построим правильную ментальную модель.

Терминал — это среда, в которой запускаются небольшие специализированные программы. Философия большинства из них очень простая: «делай одну вещь, но делай ее хорошо».

Это похоже на хороший код. Функция должна решать одну задачу, а сложное поведение строится из комбинации нескольких простых функций. В терминале все работает примерно так же. Например:

– history | fzf — интерактивный поиск по истории ранее введенных команд.
- git log | grep "fix" — поиск коммитов со словом "fix".
- git branch -a | grep "feature" — поиск всех веток, содержащих "feature".

Если сравнить с обычными приложениями, то разница только в интерфейсе. В графическом приложении ты нажимаешь кнопки. В терминале ты передаешь параметры. Да, у такого подхода есть недостаток — команды и параметры нужно помнить. Но преимуществ тоже есть. Такие программы можно комбинировать практически как угодно и строить рабочий процесс именно под себя. Такой гибкости сложно добиться в обычных графических интерфейсах. А если забыл какую‑то команду — почти у каждой программы есть встроенная справка и документация.


Что мы получим в итоге?

Прежде чем переходить к настройке, хочу показать конечный результат. В этом гайде мы настроим единую терминальную среду, в которой терминал и большинство используемых программ будут в едином цветовом стиле, и ощущается это как единая экосистема.

За это отвечает Tinted — система тем, которая автоматически применяет одну цветовую схему ко всем поддерживаемым программам. При желании можно создавать собственные темы и шаблоны для новых программ, но, скорее всего, большинству это никогда не понадобится. Также есть плагины Tinted, которые добавляют темы для:

  1. VSCode

  2. Zed

  3. Конечно же NeoVim

Полный список поддерживаемых приложений доступен в официальном репозитории Tinted. Вот здесь можно посмотреть более 200+ готовых тем, которые будут доступны после настройки.

Несколько моих скриншотов:
Отображение файлов и папок
Отображение файлов и папок
opt+c Быстрый переход в папку, можно использовать стрелки для выбора.
opt+c Быстрый переход в папку, можно использовать стрелки для выбора.
Утилита bat для, быстрый просмотр содержимого файла с подсветкой синтаксиса.
Утилита bat для, быстрый просмотр содержимого файла с подсветкой синтаксиса.
ctr+r Быстрая навигация по истории введенных команд.
ctr+r Быстрая навигация по истории введенных команд.

Такой результат ты можешь получить, если пройдешь по моей инструкции.

Чтобы сменить тему на любую другую, достаточно выполнить одну команду, которая указана под каждой темой в галерее. Например:

tinty apply base16-zenburn

Дальше мы настроим остальные инструменты командной строки, так чтобы они автоматически использовали эту же цветовую схему.

Сразу оговорюсь: гайд ориентирован в первую очередь на пользователей macOS. Если ты пользуешься Linux, то, скорее всего, большая часть того, о чем пойдет речь, тебе уже знакома. Если у тебя Windows, то сорян 🤷‍♂️, разбираться с терминалом придется самостоятельно, но я думаю, большая часть будет такой же. Перейдем непосредственно к настройке.


⚠️ Дисклеймер

Все материалы предоставляются «как есть», без каких‑либо гарантий работоспособности, совместимости или пригодности для использования в конкретной системе.

Перед выполнением команд и установкой программ самостоятельно проверяйте ссылки, источники и содержимое запускаемых скриптов. Не выполняйте команды, назначение которых вам неизвестно.

Перед применением конфигураций рекомендуется сделать резервные копии существующих настроек.

Автор не несёт ответственности за потерю данных, повреждение системы, нарушение работы программного обеспечения или любые иные последствия, возникшие в результате использования материалов из этого репозитория.

Все упомянутые названия программ, логотипы и товарные знаки принадлежат их правообладателям.


Быстрый старт

Все конфигурационные файлы из статьи уже собраны в отдельном репозитории. Если хочешь сразу приступить к настройке без объяснений, просто перейдите по ссылке и следуйте инструкции.


План такой:

  1. Установим пакетный менеджер Homebrew.

  2. Установим терминал Alacritty.

  3. Установим шрифт с иконками JetBrains Mono Nerd Font

  4. Настроим базовый набор инструментов, без которого я не представляю работу в терминале:

    • zsh — командная оболочка, вместо bash. В macOS она должна быть установлена уже по умолчанию.

      • zsh‑autosuggestions — плагин для zsh, подсказки команд из истории.

      • zsh‑syntax‑highlighting — плагин для zsh, подсветка синтаксиса прямо во время ввода.

    • starship — красивый и быстрый промпт.

    • zoxide — умная замена cd.

    • eza — современная замена ls с цветным выводом, иконками и поддержкой дерева каталогов.

    • fzf — нечеткий поиск.

    • fd — современная замена find.

    • ripgrep (rg) — быстрый поиск по файлам.

    • bat — улучшенная версия cat с подсветкой синтаксиса.

    • Git Delta — красивый просмотр изменений в Git.

    • Tinted — единая система тем для всех программ.

  5. Подведем итоги.


1. Homebrew — пакетный менеджер для macOS

Если ты только начинаешь пользоваться терминалом, первое, что стоит установить — Homebrew. Если проводить аналогию с frontend, то Homebrew — это что‑то вроде npm, только для macOS. Через него мы будем устанавливать практически все программы из этого гайда, а в дальнейшем — и обновлять их буквально одной командой. Проверим, установлен ли Homebrew:

brew --version

Если команда не найдена, устанавливаем Homebrew официальным способом:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Во время установки установщик сам подскажет, какие команды нужно выполнить после завершения. Обычно это команды для добавления Homebrew в переменную окружения PATH. После этого перезапусти терминал. И снова проверим, что все работает:

brew --version

Теперь обновим список пакетов:

brew update

2. Alacritty — терминал

Стандартный Terminal.app вполне рабочий, но лично мне он никогда не нравился. Я перепробовал практически все популярные терминалы: iTerm2, Kitty, WezTerm, Ghostty. В итоге остановился на Alacritty. Он быстрый, минималистичный, отлично работает на macOS и практически не требует настройки. Устанавливается одной командой:

brew install --cask alacritty

После установки запусти Alacritty через Spotlight или из Launchpad. Пока он выглядит максимально скучно, но это нормально. В следующих разделах мы постепенно превратим его в удобную рабочую среду.


3. Устанавливаем базовые утилиты

Теперь установим весь минимальный набор программ.

brew install \
zsh \
zoxide \
fzf \
fd \
ripgrep \
bat \
starship \
git-delta \
tinty

После установки проверим, что все успешно установилось.

zsh --version
starship --version
fzf --version
fd --version
rg --version
bat --version
delta --version
tinty --version

Если каждая команда вывела свою версию — все прошло успешно.


4. Плагины для Zsh

Осталось установить два небольших плагина, без которых пользоваться оболочкой уже не так приятно. Устанавливаем:

brew install zsh-autosuggestions
brew install zsh-syntax-highlighting

Позже мы подключим их в конфигурации ~/.zshrc. На этом с установкой можно закончить. Все необходимые программы уже находятся в системе. Теперь осталось самое интересное — настроить их так, чтобы они работали как единая экосистема.


1. Настройка Zsh

Zsh — это командная оболочка (shell), через которую ты взаимодействуешь с терминалом. Именно она запускает команды, хранит историю, поддерживает автодополнение, алиасы и многое другое. Практически вся настройка Zsh хранится в одном файле — ~/.zshrc. В нем обычно находятся:

  • настройки оболочки

  • алиасы

  • переменные окружения

  • подключение плагинов

  • настройка внешнего вида

  • запуск дополнительных программ при старте терминала

Чтобы не настраивать все вручную, просто создай конфигурацию, в которой уже все настроено, а дальше мы только будем донастраивать конфиги.

cat > ~/.zshrc <<'EOF'
# ---------- Подключение Homebrew ----------
[[ -d /opt/homebrew/bin ]] && export PATH="/opt/homebrew/bin:$PATH"

# ---------- ZSH HISTORY MANAGEMENT ----------
export HISTFILE="$HOME/.zsh_history"         # Файл, в котором хранится история команд
export SAVEHIST=100000                       # Максимальное количество команд, сохраняемых на диск
export HISTSIZE=100000                       # Максимальное количество команд в памяти

# Опции оптимизации и безопасности истории
setopt HIST_IGNORE_ALL_DUPS                  # Удалять все предыдущие дубликаты команды
setopt HIST_IGNORE_SPACE                     # Не сохранять команды, начинающиеся с пробела
setopt SHARE_HISTORY                         # Общая история между всеми открытыми окнами терминала
setopt HIST_FIND_NO_DUPS                     # Не показывать дубликаты при поиске по истории
setopt HIST_REDUCE_BLANKS                    # Удалять лишние пробелы перед сохранением команды
setopt EXTENDED_HISTORY                      # Сохранять время выполнения каждой команды
setopt HIST_NO_STORE                         # Не сохранять команду history в историю
setopt HIST_EXPIRE_DUPS_FIRST                # При переполнении сначала удалять дубликаты

# ---------- UX & SHELL BEHAVIOUR ----------
setopt AUTOCD                                # Переход в папку без команды cd
setopt NOBEEP                                # Отключить системный сигнал
setopt NUMERIC_GLOB_SORT                     # Сортировка: file2 перед file10

# ---------- MANUAL PLUGINS INITIALIZATION ----------
# Подключение плагинов, установленных через Homebrew

# Автоподсказки команд
if [[ -f "$(brew --prefix)/share/zsh-autosuggestions/zsh-autosuggestions.zsh" ]]; then
  source "$(brew --prefix)/share/zsh-autosuggestions/zsh-autosuggestions.zsh"
fi

# Подсветка синтаксиса
if [[ -f "$(brew --prefix)/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh" ]]; then
  source "$(brew --prefix)/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh"
fi

# ---------- ALIASES ----------
# Здесь будут находиться пользовательские алиасы

alias ls='eza -l -g -a --git --color=auto --group-directories-first --icons'
alias lt='ls --tree --level=1 --sort=modified --reverse'
alias tree="eza --tree"

alias cat="bat"

alias tinty='tinty --config $HOME/.config/tinted-theming/tinty/config.toml'

# ---------- TOOLS INITIALIZATION ----------
# Инициализация инструментов. Выполняется в самом конце.
(( $+commands[brew] )) && eval "$(brew shellenv)"
(( $+commands[fzf] )) && source <(fzf --zsh)                      # Интеграция fzf с Zsh
(( $+commands[starship] )) && source <(starship init zsh --print-full-init) # Инициализация Starship
(( $+commands[zoxide] )) && eval "$(zoxide init zsh)"             # Умная замена команды cd
(( $+commands[tinty] )) && eval "$(tinty init)"                   # Автоматическое применение тем
EOF

В конфигурации есть строки, которые подключают плагины, установленные нами ранее для Zsh.

# Автоподсказки команд
if [[ -f "$(brew --prefix)/share/zsh-autosuggestions/zsh-autosuggestions.zsh" ]]; then
  source "$(brew --prefix)/share/zsh-autosuggestions/zsh-autosuggestions.zsh"
fi
# Подсветка синтаксиса
if [[ -f "$(brew --prefix)/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh" ]]; then
  source "$(brew --prefix)/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh"
fi

После этого перезагрузи оболочку:

exec ~/.zshrc

И перезагрузи конфиг:

source ~/.zshrc

На этом настройка Zsh завершена.


2. Настройка Starship

Starship — это современный и очень быстрый промпт для терминала. Он отвечает за строку приглашения, которую ты видишь перед вводом каждой команды. Например, вместо обычного:

user@MacBook ~ %

можно получить что‑то вроде:

~/projects/my-app main 
➜

Starship поддерживает огромное количество языков программирования, систем контроля версий и различных инструментов. Я использую минималистичный вариант, который показывает только то, что действительно полезно во время повседневной работы:

  • текущую директорию

  • текущую Git‑ветку

  • индикатор Node.js‑проекта (вы можете настроить это под свой ЯП)

  • количество фоновых задач

  • время выполнения долгих команд

Конфигурация

Создай файл:

touch ~/.config/starship.toml

Вставь конфиг в файл:

cat > ~/.config/starship.toml <<'EOF'
"$schema" = "https://starship.rs"

add_newline = false

# Главный формат строки
# \n переносит символ ввода на следующую строку
format = "$directory$git_branch$nodejs$jobs$cmd_duration\n$character"

[directory]
format = "[$path](bold cyan) "
truncation_length = 0          # Никогда не сокращать путь
truncate_to_repo = false       # Не обрезать путь до корня Git-репозитория
fish_style_pwd_dir_length = 0  # Не сокращать названия папок

[nodejs]
symbol = " "
format = "[$symbol](bold green) "
detect_files = ["package.json", ".node-version", ".nvmrc", "jsconfig.json", "tsconfig.json"]
detect_folders = ["node_modules"]

[jobs]
symbol = " "
format = "[$symbol$number](bold red) "
number_threshold = 1
disabled = false

[character]
success_symbol = "[➜](bold green) "
error_symbol = "[➜](bold red) "
EOF

После сохранения открой новое окно терминала или выполни:

source ~/.zshrc

В итоге получится двухстрочный промпт. На первой строке отображается рабочая информация: текущая директория, Git‑ветка и индикаторы проекта. На второй — только символ ввода команды. Такое расположение делает терминал заметно чище, особенно если работаешь с длинными путями или часто используешь Git.


3. Настройка терминала Alacritty

Alacritty — это быстрый и минималистичный терминал. По умолчанию он практически не настроен, поэтому сразу приведем его к более удобному виду.

Заодно установим JetBrains Mono Nerd Font — шрифт, который содержит все необходимые иконки для Starship, Git Delta, NeoVim и большинства современных терминальных утилит.

Устанавливаем шрифт

Homebrew Formulae: font‑jetbrains‑mono‑nerd‑font

brew install --cask font-jetbrains-mono-nerd-font

Конфигурация

Создай каталог конфигурации:

mkdir -p ~/.config/alacritty

Подготовка к настройке тем

touch ~/.config/alacritty/colors.toml

Пока файл colors.toml останется пустым — это нормально. Мы вернемся к нему в разделе, посвященном настройке Tinted.

Теперь создай фай:

touch ~/.config/alacritty/alacritty.toml

И добавим в него конфиг:

cat > ~/.config/alacritty/alacritty.toml <<'EOF'
[window]
padding = { x = 3, y = 3 }
dynamic_title = true

[font]
size = 13.5

[font.offset]
y = 4

[font.normal]
family = "JetBrainsMono Nerd Font"
style = "Light"

[font.bold]
family = "JetBrainsMono Nerd Font"
style = "Medium"

[font.italic]
family = "JetBrainsMono Nerd Font"
style = "Light"

[font.bold_italic]
family = "JetBrainsMono Nerd Font"
style = "Medium"

[cursor]
style = { shape = "Block", blinking = "Off" }

[general]
live_config_reload = true
import = ["./colors.toml"]

[scrolling]
history = 50000
EOF

Перезапусти Alacritty.

После этого терминал станет заметно приятнее:

  • шрифт сменится на JetBrains Mono Nerd Font

  • увеличится история прокрутки

  • изменения конфигурации будут применяться автоматически без перезапуска

  • появится поддержка единой цветовой схемы, которую мы настроим позже


4. Настройка базовых утилит

Теперь настроим терминал и оболочку. Добавим инструменты, которые будут ускорять ежедневную работу.

Хорошая новость — большинство из них практически не требуют настройки, и мы уже из подключили, тут просто рассмотрим эти программы.

Zoxide

Zoxide — это умная замена стандартной команды cd.

Вместо того чтобы каждый раз писать полный путь:

cd ~/projects/my-project/frontend

достаточно несколько раз перейти в нужную папку, после чего zoxide запомнит ее:

z my-project

В подключение в zsh выглядит так:

(( $+commands[zoxide] )) && eval "$(zoxide init zsh)"

Можно использовать z в место cd:

z название_папки

Eza

Eza — современная замена ls. Она добавляет цветной вывод, иконки, более удобное отображение файлов и поддержку дерева каталогов.

Алиасы для eza мы так же уже добавили при создании конфига zsh, выглядит это так:

alias ls="eza"
alias ll="eza -lah"
alias tree="eza --tree"

Можем использовать:

ll

покажет подробный список файлов, а:

tree

выведет структуру текущей директории.


Fzf

Fzf — это нечеткий поиск практически чего угодно. Он позволяет быстро искать файлы, команды из истории и различные элементы прямо из терминала.

Fzf мы так же уже добавили при создании конфига zsh:

(( $+commands[fzf] )) && source <(fzf --zsh)

Можем использовать:

  • Ctrl + R — поиск по истории команд

  • Ctrl + T — поиск файлов

  • Opt + C — быстрый переход между папками


Ripgrep

Ripgrep (rg) — это очень быстрый поиск по содержимому файлов. Отдельная настройка ему не нужна.

После установки можно сразу использовать:

rg "search_text"

Например:

rg "useState"

найдет все места использования useState в проекте.


FD

FD — современная замена стандартной команды find. Она имеет более простой синтаксис и приятный вывод.

Найти все TypeScript‑файлы:

fd ".ts"

Найти папку:

fd node_modules

Bat

Bat — улучшенная версия cat. Он добавляет подсветку синтаксиса, номера строк и красивый вывод файлов.

Алиас уже добавлен:

alias cat="bat"

Можем проверять:

cat package.json

Git Delta

Git Delta — это улучшенный просмотр изменений в Git. Он заменяет стандартный вывод git diff на более удобный: с подсветкой, группировкой изменений и улучшенной читаемостью.

Добавим его в конфигурацию Git:

git config --global core.pager delta
git config --global interactive.diffFilter "delta --color-only"

После этого обычный:

git diff

будет автоматически использовать Delta. У нее есть множество настроек, которые стоить изучить самостоятельно.


5. Настройка Tinted

Вот мы и подошли к финальному этапу — настроим Tinted и объединим все программы в единую среду.

Создай каталог для конфигурации:

mkdir -p ~/.config/tinted-theming/tinty

Теперь создадим файл конфигурации:

touch ~/.config/tinted-theming/tinty/config.toml

Добавь в него следующую конфигурацию:

cat > ~/.config/tinted-theming/tinty/config.toml <<'EOF'
shell = "zsh -c '{}'"
default-scheme = "base16-mocha"

[[items]]
name = "tinted-shell"
path = "https://github.com/tinted-theming/tinted-shell"
themes-dir = "scripts"
hook = "source \"$TINTY_THEME_FILE_PATH\""
supported-systems = ["base16", "base24"]

[[items]]
path = "https://github.com/tinted-theming/tinted-terminal"
name = "tinted-terminal"
themes-dir = "themes/alacritty"
hook = "cp -f %f ~/.config/alacritty/colors.toml"
supported-systems = ["base16", "base24"]

[[items]]
path = "https://github.com/tinted-theming/tinted-delta"
name = "tinted-delta"
themes-dir = "configs"
supported-systems = ["base16", "base24"]
EOF

Ранее при настройке Zsh мы уже подключили Tinted:

alias tinty='tinty --config $HOME/.config/tinted-theming/tinty/config.toml'

(( $+commands[tinty] )) && eval "$(tinty init)"

Осталось скачать шаблоны, которые использует Tinted для генерации тем:

tinty sync

После этого все готово.

Теперь изменить оформление всего терминального окружения можно одной командой:

tinty apply base16-mocha

Проверяем результат

Посмотреть список доступных тем:

tinty list

Открыть галерею тем прямо в браузере:

tinty gallery

Попробовать другую тему:

tinty apply base16-gruvbox-dark-medium

Менять темы можно сколько угодно — изменения применяются автоматически ко всем подключенным программам.

Итог

Поздравляю! Теперь у тебя есть полноценная терминальная среда с единой системой оформления.

Одной командой изменяется внешний вид:

  • Alacritty — терминала.

  • Zsh — командной оболочки.

  • Git Delta — просмотра изменений в Git.

Tinted поддерживает десятки других программ, поэтому со временем можно подключать новые инструменты, сохраняя единый стиль оформления всего рабочего окружения.

Главное преимущество такого подхода — больше не нужно искать и настраивать отдельную тему для каждой программы. Достаточно выбрать понравившуюся цветовую схему, а Tinted сделает все остальное.


Если гайд оказался полезным — подписывайся на мой телеграм канал. Там я делюсь полезными находками и рассказываю про фронтенд и терминал.