Skip to content

Instantly share code, notes, and snippets.

@kevin-smets
Last active December 5, 2024 01:19
Show Gist options
  • Save kevin-smets/8568070 to your computer and use it in GitHub Desktop.
Save kevin-smets/8568070 to your computer and use it in GitHub Desktop.
iTerm2 + Oh My Zsh + Solarized color scheme + Source Code Pro Powerline + Font Awesome + [Powerlevel10k] - (macOS)

Default

Default

Powerlevel10k

Powerlevel10k

How to install

iTerm2

brew install --cask iterm2

Or, if you do not have homebrew (you should ;)): Download and install iTerm2

iTerm2 has better color fidelity than the built in Terminal, so your themes will look better.

Get the iTerm color settings

Just save it somewhere and open the file(s). The color settings will be imported into iTerm2. Apply them in iTerm through iTerm → preferences → profiles → colors → load presets. You can create a different profile other than Default if you wish to do so.

Oh My Zsh

More info here: https://github.com/robbyrussell/oh-my-zsh

Install with curl

sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"

When the installation is done, edit ~/.zshrc and set ZSH_THEME="agnoster" for the default look. Or better yet, go for Powerlevel10k.

Powerlevel9k / Powerlevel10k

Why Powerlevel10k? Well, because it's a drop-in replacement for Powerlevel9k, just a lot faster to render your prompt. ls feels fast again!

So if you prefer the Powerlevel10k look with added info such as exit codes and timestamps on the right, run:

git clone https://github.com/romkatv/powerlevel10k.git $ZSH_CUSTOM/themes/powerlevel10k

Then edit your ~/.zshrc and set ZSH_THEME="powerlevel10k/powerlevel10k". Once you do so, when you start a new terminal session, the Powerlevel10 configure wizard will be launched to set your prompt, beware, there are many many options!

Powerlevel10k offers a whole lot more and is extremely configurable, best is to check its project page.

If you want to trigger the configuration wizard immediately, simply run p10k configure to discover all options, which are plentiful.

Install a patched font

If you did not go with Powerlevel10k or you want another font, read on:

Open the downloaded font and press "Install Font".

Set this font in iTerm2 (iTerm → Preferences → Profiles → Text → Font), in the dropdown select the desired Font. You will see it change on the fly.

Restart iTerm2 for all changes to take effect.

Further tweaking

Things like

  • auto suggestions
  • word jumping with arrow keys / natural text editing
  • syntax highlighting
  • visual studio code config

can be found in the section below.

Auto suggestions (for Oh My Zsh)

Auto suggestions

Just follow these steps: https://github.com/zsh-users/zsh-autosuggestions/blob/master/INSTALL.md#oh-my-zsh

If the auto suggestions do not appear to show, it could be a problem with your color scheme. Under "iTerm → Preferences → Profiles → Colors tab", check the value of Black Bright, that is the color your auto suggestions will have. It will be displayed on top of the Background color. If there is not enough contrast between the two, you won't see the suggestions even if they're actually there..

Enable word jumps and word deletion, aka natural text selection

By default, word jumps (option + → or ←) and word deletions (option + backspace) do not work. To enable these, go to "iTerm → Preferences → Profiles → Keys → Key mappings → Presets... → Natural Text Editing → Boom! Head explodes"

Syntax highlighting

Clone the repository:

git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting

Activate the plugin in ~/.zshrc:

plugins=( [plugins...] zsh-syntax-highlighting)

Restart iTerm2 for all changes to take effect.

Visual Studio Code config

Installing a patched font will mess up the integrated terminal in VS Code unless you use the proper settings. You'll need to go to settings (CMD + ,) and add or edit the following values:

  • for Source Code Pro + Font Awesome: "terminal.integrated.fontFamily": "'SourceCodePro+Powerline+Awesome Regular'". The single quotes are important! Restart VS Code after the config change.
  • for Source Code Pro: "terminal.integrated.fontFamily": "Source Code Pro for Powerline"
  • for Meslo: "terminal.integrated.fontFamily": "Meslo LG M for Powerline"
  • for other fonts you'll need to check the font name in Font Book. You can right click on them on select "Show in Finder" to get the exact name.

You can also set the fontsize e.g.: "terminal.integrated.fontSize": 14

@kn-wield
Copy link

kn-wield commented Aug 9, 2022

Bravo! 👏

@joleroi
Copy link

joleroi commented Aug 19, 2022

It seems like the solarized dark theme is available in iterm2 by default. Is that correct?

@mnjit20
Copy link

mnjit20 commented Aug 21, 2022

🥷 Excellent @kevin-smets

@mancoder320
Copy link

Снимок экрана 2022-09-08 в 02 17 29

I do all from this instruction. Iterm2 works well. But after all manipulation - standard terminal don't show right icons like it was with VS code before I fix it with installation 4 MesloLGS NF fonts (regular,bold, etc). Its fix the problem with vs code, bud not in standard mac os terminal. Are any options of how to fix it?

@romkatv
Copy link

romkatv commented Sep 8, 2022

@mancoder320 You need to change the font of every terminal that you wan to use. Apparently you didn't change it in Apple Terminal. See https://github.com/romkatv/powerlevel10k/blob/master/font.md for instructions.

@mancoder320
Copy link

@mancoder320 You need to change the font of every terminal that you wan to use. Apparently you didn't change it in Apple Terminal. See https://github.com/romkatv/powerlevel10k/blob/master/font.md for instructions.

It works now! Thank you

@philldev
Copy link

Screen Shot 2022-09-26 at 16 13 51

for those who terminal font doesnt work

@romkatv
Copy link

romkatv commented Sep 26, 2022

@philldev
Copy link

Proper font instructions are here: https://github.com/romkatv/powerlevel10k/blob/master/font.md

thankyou!

@nenujeke
Copy link

how can i uninstall or go back to default iterm settings

@tonyamano24
Copy link

How to resolve the issue i see in VSCode Terminal image

install font support terminal

@LexChien
Copy link

LexChien commented Nov 11, 2022

@tonyamano24 this question maybe's not have installed a font. You can install or re-install the font, and you need iTerm2 > Preferences > profiles > text > Font. Change font file.

@luca-preibsch
Copy link

I have a different color scheme for ls and cd + tab and I would like to fix that, default it looks like this:

image

I then added this at the bottom of my .zshrc:

export LS_COLORS="rs=0:di=01;34:ln=01;36:mh=00:pi=40;33:so=01;35:do=01;35:bd=40;33;01:cd=40;33;01:or=40;31;01:mi=00:su=37;41:sg=30;43:ca=30;41:tw=30;42:ow=34;42:st=37;44:ex=01;32:*.tar=01;31:*.tgz=01;31:*.arc=01;31:*.arj=01;31:*.taz=01;31:*.lha=01;31:*.lz4=01;31:*.lzh=01;31:*.lzma=01;31:*.tlz=01;31:*.txz=01;31:*.tzo=01;31:*.t7z=01;31:*.zip=01;31:*.z=01;31:*.dz=01;31:*.gz=01;31:*.lrz=01;31:*.lz=01;31:*.lzo=01;31:*.xz=01;31:*.zst=01;31:*.tzst=01;31:*.bz2=01;31:*.bz=01;31:*.tbz=01;31:*.tbz2=01;31:*.tz=01;31:*.deb=01;31:*.rpm=01;31:*.jar=01;31:*.war=01;31:*.ear=01;31:*.sar=01;31:*.rar=01;31:*.alz=01;31:*.ace=01;31:*.zoo=01;31:*.cpio=01;31:*.7z=01;31:*.rz=01;31:*.cab=01;31:*.wim=01;31:*.swm=01;31:*.dwm=01;31:*.esd=01;31:*.jpg=01;35:*.jpeg=01;35:*.mjpg=01;35:*.mjpeg=01;35:*.gif=01;35:*.bmp=01;35:*.pbm=01;35:*.pgm=01;35:*.ppm=01;35:*.tga=01;35:*.xbm=01;35:*.xpm=01;35:*.tif=01;35:*.tiff=01;35:*.png=01;35:*.svg=01;35:*.svgz=01;35:*.mng=01;35:*.pcx=01;35:*.mov=01;35:*.mpg=01;35:*.mpeg=01;35:*.m2v=01;35:*.mkv=01;35:*.webm=01;35:*.webp=01;35:*.ogm=01;35:*.mp4=01;35:*.m4v=01;35:*.mp4v=01;35:*.vob=01;35:*.qt=01;35:*.nuv=01;35:*.wmv=01;35:*.asf=01;35:*.rm=01;35:*.rmvb=01;35:*.flc=01;35:*.avi=01;35:*.fli=01;35:*.flv=01;35:*.gl=01;35:*.dl=01;35:*.xcf=01;35:*.xwd=01;35:*.yuv=01;35:*.cgm=01;35:*.emf=01;35:*.ogv=01;35:*.ogx=01;35:*.aac=00;36:*.au=00;36:*.flac=00;36:*.m4a=00;36:*.mid=00;36:*.midi=00;36:*.mka=00;36:*.mp3=00;36:*.mpc=00;36:*.ogg=00;36:*.ra=00;36:*.wav=00;36:*.oga=00;36:*.opus=00;36:*.spx=00;36:*.xspf=00;36:"
alias ls="ls -GFh"
zstyle ':completion:*' list-colors ${(s.:.)LS_COLORS}

But that just removes the colors from cd + tab:
image

The LS_COLORS are copied from another Linux PC as I am new to configuring my shell.

Am I missing something, can anybody tell me what's to do to match ls and cd + tab colors.

Thanks in advance.

@anthony-mini
Copy link

I think your files are stored on clouds (icloud and OneDrive), so not directly accessible.

@luca-preibsch
Copy link

In the screenshots "Desktop" and "OneDrive" are symbolic links, but the rest is my local home, so everything should be accessible.

@jbantony
Copy link

Is there any way I can edit the text displaying before the prompt?
I used to have a export PS1="%n@%d $ " defined in my old .zshrc. Any tips on how to get the same display text using oh-my-zsh??

@romkatv
Copy link

romkatv commented May 29, 2023

@jbantony Remove any line from .zshrc that mentions "p10k", "powerlevel10k" or "ZSH_THEME". Then add PS1='%n@%d $ ' (without the export).

@Gbolahan284
Copy link

image
pls sir how can i install item 2 on windows cause i'm not getting it sir

@romkatv
Copy link

romkatv commented Jun 6, 2023

You cannot install iTerm2 on Windows.

@audsilva
Copy link

getting this error
➜ ~
iconv: conversion from -t unsupported
iconv: try 'iconv -l' to get the list of supported encodings
Error converting string from to UTF-8
➜ ~
iconv: conversion from -t unsupported
iconv: try 'iconv -l' to get the list of supported encodings
Error converting string from to UTF-8
➜ ~

@AbhishekGhosh
Copy link

@Gbolahan284 : It is for MacOS

@audsilva
Copy link

yes. for MacOS

@dante4rt
Copy link

dante4rt commented Aug 2, 2023

Hello, I found some update before and my terminal just like on the screenshot.

Screenshot at Aug 02 11-04-09

Why its like "⇣4 +5 !3 ?50" ? Before update, its normal.

@orarnon
Copy link

orarnon commented Aug 7, 2023

Hello, I found some update before and my terminal just like on the screenshot.

Screenshot at Aug 02 11-04-09

Why its like "⇣4 +5 !3 ?50" ? Before update, its normal.

@dante4rt, can you share your setup for the prompt?

@romkatv
Copy link

romkatv commented Aug 7, 2023

Why its like "⇣4 +5 !3 ?50" ? Before update, its normal.

@dante4rt See https://github.com/romkatv/powerlevel10k#what-do-different-symbols-in-git-status-mean

@BaloneyBoy97
Copy link

I don't know why but after I finished the setup, when I use command ls my directories are displated unevenly
Screenshot 2023-08-17 at 10 24 16 PM

@romkatv
Copy link

romkatv commented Aug 18, 2023

@BaloneyBoy97 That's normal. ls prints files in columns. Try running it in a directory with more files to see it.

@itsdula
Copy link

itsdula commented Aug 31, 2023

This is dope, thanks a lot. Just FYI, I had an issue with setting up the fontFamily for VS Code, it kept breaking but eventually added this "MesloLGS NF" and downloaded the font files manually as cause some of them did not load. And it worked without even reloading the app.

I saw it in the the powerlevel10K repo Also has links to fonts

@wcpoon
Copy link

wcpoon commented Nov 10, 2023

Screenshot 2023-11-10 at 3 37 48 PM

Hi, Any idea how to change the "ok" to "tick" ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment