Cason Adams
Posted on September 17, 2021
I really like spending as much of my day as a software engineer in the terminal. I really wanted to get all the things to match colors, themes, etc. Now keep in mind this doesn't always solve all the things but it is a good step forward.
Goal
- Use terminal colors across vi, tmux, bat, fzf, and most other terminal applications.
Terminal setup
I really like the alacritty terminal and I needed to find a color style that works for me. I ended up with something like this:
schemes:
dark: &dark
primary:
background: "#2B2B2B"
foreground: "#BBBBBB"
normal:
black: "#252525"
red: "#DB5451"
green: "#548C26"
yellow: "#A89022"
blue: "#3A91CF"
magenta: "#A575BA"
cyan: "#009191"
white: "#CCCCCC"
bright:
black: "#666666"
white: "#FFFFFF"
light: &light
primary:
background: "#E2E2E2"
foreground: "#666666"
normal:
black: "#FFFFFF"
red: "#DB5451"
green: "#548C26"
yellow: "#A89022"
blue: "#3A91CF"
magenta: "#A575BA"
cyan: "#009191"
white: "#AAAAAA"
bright:
black: "#666666"
white: "#000000"
colors: *dark
I can switch between dark
and light
mode by changing the colors:
value. And because alacritty can do live reload of the config file. A simple script to modify that value allows for light and dark mode switching via the command line. And because I am using all ANSI colors for things everything changes in real time.
Vim setup
I created a color theme for vim based off vim-dim
Using vim-plug I load the plugin like this:
call plug#begin('~/.config/nvim/plugged'
Plug 'casonadams/vim-dim'
call plug#end()
colorscheme dim
Be sure that set termguicolors
is not in the vimrc
or init.vim
file.
shell setup
I use fzf and bat for fuzzy searching to set it to use ANSI colors do the following in a bashrc or zshrc file.
snippet
export BAT_THEME="ansi"
export FZF_DEFAULT_OPTS="
--inline-info \
--layout=reverse \
--ansi \
--color=16 \
full working example
export BAT_THEME="ansi"
export FZF_DEFAULT_COMMAND="fd -uu"
export FZF_CTRL_T_COMMAND="${FZF_DEFAULT_COMMAND} --type file"
export FZF_ALT_C_COMMAND="${FZF_DEFAULT_COMMAND} --type directory"
export FZF_DEFAULT_OPTS="
--inline-info \
--layout=reverse \
--ansi \
--color=16 \
--preview-window=:hidden \
--preview '([[ -f {} ]] \
&& (bat --style=numbers --color=always {} \
|| cat {})) \
|| ([[ -d {} ]] && (tree -C {} | less)) \
|| echo {} 2> /dev/null | head -200' \
--bind '?:toggle-preview'
"
tmux fun (iterm dimming)
Modifying tmux doesn't need to happen, but this is a fun trick to add using this color idea.
- Currently this only looks good in dark mode
set -g pane-border-style fg=colour8,bg=colour237
set -g pane-active-border-style fg=blue,bg=colour237
set-window-option -g window-active-style bg=terminal
set-window-option -g window-style bg=colour237
full tmux color settings from images
######### THEME ##########
set -g status-style bg=colour8,fg=colour7
setw -g clock-mode-colour green
set -g mode-style bg=blue,fg=colour7
set -g message-style bg=colour8,fg=colour7
set -g message-command-style bg=colour8,fg=colour7
set-option -g status-right-length 100
set-option -g status-left-length 100
set -g status-left " #{?pane_synchronized, ยค ,}#{?window_zoomed_flag, โ ,}[#S-#{window_active_clients}] "
set -g status-right "#(cd #{pane_current_path}; git branch --show-current) #H "
set -g pane-border-style fg=colour8,bg=colour237
set -g pane-active-border-style fg=blue,bg=colour237
set-window-option -g window-active-style bg=terminal
set-window-option -g window-style bg=colour237
Posted on September 17, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.