Overblog Tous les blogs Top blogs Entreprises & Marques Tous les blogs Entreprises & Marques
Editer l'article Suivre ce blog Administration + Créer mon blog
MENU
http://corb.over-blog.com/

corb.over-blog.com/

Publicité

Iterm2 Themes



by rajaraodv

Meslo LG DZ for Powerline Iterm2 font Note — If you are confused about the fonts and Themes: the Themes are for 'Oh My ZSH' and ZSH shell and the fonts are for the Iterm2 itself. At this point your Terminal should look like below: Step 5 — Install iTerm2 'color schemes' (ITerm2 Themes). Over 100 color schemes/themes for iTerm/iTerm2. Contribute to teaey/iTerm2-Color-Schemes development by creating an account on GitHub. ITerm2 is now 3.3.0 now. They update things occasionally, but every update makes it count. ITerm2 + zsh + oh my zsh themes gives the best experience. View entire discussion ( 23 comments). I'm looking for a dark and consistent theme that works well in iTerm2, terminal emacs, terminal vim and fish. I've tried gruvbox and nord and a a few others and they all have problems. Either not working really well in the terminal or inconsistent background colors, etc.

In this blog I'll cover installing ITerm2, ZSH shell, 'oh my ZSH', Themes, ITerm2 color schemes, 'oh my ZSH' plugins and enable 'ligature' support to help create a beautiful and powerful Terminal.

If you want to just make your regular Bash Terminal powerful, take a look at my previous blog: 'Jazz Up Your Bash Terminal'. But ZSH explained in this blog is more powerful stuff.
Summary:

We'll be covering a lot of things. This may be confusing, so here is the summary of what we will be doing.

  1. Install ITerm2 — This is a better alternative to the default Terminal
  2. Install latest ZSH shell — This is more powerful than the regular bash shell. We will switch ITerm2 to use ZSH shell.
  3. Install 'Oh My ZSH '— This is a CLI tool to easily configure ZSH and add themes and plugins to ZSH
  4. Add two types of Themes using 'Oh My ZSH' — some themes need extra steps so we will cover both
  5. Install different ITerm2 Schemes — These are just color schemes for the UI
  6. Add two different Plugins using 'Oh My ZSH' to improve productivity
  7. Enable 'ligature' support so when you write an arrow =>;, it appears like a real arrow →
Step 1— Install ITerm2

A lot of programmers like ITerm2 instead of the default Terminal. It is similar to the Terminal, but has lots of features of its own. It of course can run ZSH, Bash, and other shells inside it.

The following video shows some of the new features of Item 2 (v3).

For this blog we'll use ITerm2. When I mention 'Terminal', I mean ITerm2. Although the steps are the same for both Terminal or ITerm2.
Step 2— Change Shell To ZSH

The following video shows why ZSH is better than just a bash shell.

Option 1 — Use Mac's own ZSH:

Mac comes with a ZSH out-of-the-box, so we don't need to install it. However, sometimes it's an older version of ZSH. Typically it's located at /bin/zsh. To use it, all we need to do is to change shell (chsh).

  1. Open the Terminal (or ITerm2) and type the following command.

2. Enter the password and it will change the shell, upon logout and login.

3. Logout and re-login

4. To test, open the Terminal and type the following, and it should say zsh.

Option 2— Install Homebrew and Install latest ZSH via Homebrew

This option is pretty common among users, because some of the plugins only work with the latest ZSH.

Homebrew, simply said, is a command line installer for all sorts of software. Let's install that first.

  1. Install Homebrew by running the following command.

2. If you get Command Line Tools for Xcode error, it means you haven't installed the CLI tools for Xcode. If you don't get the error, you can skip this step, because you already have it installed.

XCode Developer CLI tools are used by various apps that manipulate core OSX features. So make sure to install the Xcode CLI tools by running the following command.

$ xcode-select —-install

Note: The above command opens up Mac's installer and installs the XCode Developer CLI tools. If it doesn't work, try xcode-select -r to reset.

3. Install ZSH via Homebrew

Run the following command to install ZSH. It gets installed at /usr/local/bin/zsh PS: Mac's default ZSH is at /bin/zsh

4. Use the Homebrew version of ZSH

Run the following command. You will be prompted to enter Mac's password.

5. Logout and log back in.

6. Test if we are using ZSH and the correct ZSH

Step 3— 'Oh My ZSH'

'Oh My ZSH' is a plugin that runs on top of ZSH. It provides default config for ZSH (~/.zhrc file) and also provides themes and more features.

From what I know, most power users who use ZSH also use 'Oh My ZSH'.
  1. Install 'Oh My ZSH'

Run the following command to install 'oh My ZSH'.

2. Close and quit ITerm2 and reopen it.

It should look something like below. Notice that the prompt has changed and the theme is a bit different — That's 'Oh My ZSH' in action for you.

Step 4— Change Themes And Install Fonts

In this step, we'll add two different 'Oh My ZSH' Themes. 'Oh My ZSH' comes with tons of themes. PS: But some Themes need extra steps like installing specific fonts and so on.

To set a Theme, simply open ~/.zshrc file (created by 'Oh My ZSH') and change the theme as shown below.

PS: .zshrc is the config file for ZSH shell. People who don't use 'Oh My ZSH' will have to manually create this file and add any configs themselves. 'Oh My ZSH' automatically creates this file if it doesn't exist and then adds its own set of configs into this file.
Theme 1 — Let's add a Theme called 'Avit'
  1. Open .zshrc

2. Change the Theme to 'Avit'

You can browse all the 'Oh My ZSH' Themes here. To change the Theme, simply change the ZSH_THEME value in ~/.zshrc file from robbyrussell to Avit.

3. Update ZSH config

Run the following command to update the config.

4. Change the background color and font size

Open ITerm2 > Preferences > Profiles > Colors and change the background black color to use 20% gray as shown below.

Then open Text > Change Font and change the size to 14pt.

OK, Let's install a different Theme that needs fonts.

Theme 2 — Installing 'agnoster' Oh My ZSH theme

This is a popular theme because it emulates the Powerline Python app that enhances the terminal. The following picture shows how it looks. But this theme also needs us to install Powerline themes.

1. Install Powerline fonts

2. Change the Theme to 'agnoster'

3. Quit ITerm2 and reopen it.

4. Set Powerline font

You can set any Powerline patched font you like. All the fonts end with 'for Powerline'.

Open ITerm2 > Preferences > Profiles > Text > Change Font and set it to something that has 'for Powerline'. I'm choosing 'Meslo LG DZ for Powerline' font.

Note — If you are confused about the fonts and Themes: the Themes are for 'Oh My ZSH' and ZSH shell and the fonts are for the Iterm2 itself.
5. All Done

At this point your Terminal should look like below:

Step 5 — Install iTerm2 'color schemes' (ITerm2 Themes)

There are plenty of gorgeous color schemes for iTerm2. These schemes change the foreground color, background color, cursor color, and so on. You can find them at iTerm2-color-schemes Github repo.

Note: These are just color schemes of the ITerm2 UI and don't deal with the command prompt's look and feel like 'Oh My ZSH''s themes (other than just changing colors).

Follow these steps to install them.

  1. Download the iTerm2-color-schemes as a zip file and extract it
  2. The 'Schemes' folder contains all the color scheme files — they end with .itermcolors
  3. Open iTerm2 > Preferences > Profile > Colors > Color Presets > Import
  4. In the import window, navigate to the 'Schemes' folder (from step 2)
  5. Select all the files so you can import all the color schemes at once
  6. Simply select whichever color scheme you like.
My favorites are Batman and Argonaut

The Argonaut color scheme looks like below:

Step 6— Install Plugins

Plugins add more functionalities to your workflow. By default 'Oh My ZSH' already has the 'git' plugin! and that's why you were able to see all those Git statuses in the prompts in earlier screenshots. Let's add another one to see how it works.

Note: In this section, we'll install two different plugins to show how they work.
Plugin 1 — Add Syntax Highlighting Plugin

The Syntax Highlighting plugin adds beautiful colors to the commands you are typing as shown below.

Iterm Color Schemes

  1. Clone the zsh-syntax-highlighting plugin's repo and copy it to the 'Oh My ZSH' plugins directory.

2. Activate the plugin in ~/.zshrc by adding `zsh-syntax-highlighting to the Plugins section as shown below.

3. Re-read zshrc configuration

Plugin 2 — Add ZSH-AutoSuggestion Plugin

This plugin auto suggests any of the previous commands. Pretty handy! To select the completion, simply press → key.

  1. Install the plugin

Iterm2 Theme Best

PS: ZSH_CUSTOM points to ~/.oh-my-zsh/custom

2. Open ~/.zshrc and add zsh-autosuggestions

Step 7 — Use Ligature Support

There are various fonts that help make operators like less than, double equals, right arrow, not equals, and so on look beautiful. For example, every time you type: =>, it becomes: →.

To use this, we need fonts that support ligatures. We also need to enable it in ITerm2. FiraCode is one such font. Follow the steps to install and enable ligatures.

  1. Download the FiraCode repo and extract the zip file (or clone it)
  2. Open the dstr > ttf folder and double click on all the *.ttf files and select the 'Install font' button to install each of the font variations.
  3. Navigate to ITerm2 | Preferences | Profiles | Text
  4. Select Use Ligaturescheckbox
  5. Click on Change Font and select Fira Code Regular font
Summary

We have covered a lot in this blog starting from installing latest ZSH via Homebrew, Oh My ZSH, Plugins, Themes, enable 'ligatures' for FiraCode font.

?? Thank you!

If this was useful, please click the clap ? button down below a few times to show your support! ⬇⬇⬇ ??
My Other Posts
ECMAScript 2015+
Terminal Improvements
WWW
Virtual DOM
React Performance
Functional Programming

Iterm2 Themes Solarized

WebPack
  1. Webpack & Hot Module Replacement [HMR] (under-the-hood)
Draft.js
React And Redux :
  1. A Guide For Building A React Redux CRUD App (3-page app)
If this was useful, please click the clap ? button below a few times to show your support! ⬇⬇⬇ ??

If you have questions, please feel free to ask me on Twitter: https://twitter.com/rajaraodv

Intro

This is a set of color themes for iTerm (aka iTerm2). Screenshots below and in the screenshots directory.

Installation Instructions

To install:

  • Launch iTerm 2. Get the latest version at iterm2.com
  • Type CMD+i
  • Navigate to Colors tab
  • Click on Load Presets
  • Click on Import
  • Select the .itermcolors file(s) of the scheme(s) you'd like to use
  • Click on Load Presets and choose a color scheme

X11 Installation and Terminator configuration

See the README file for instructions on installing themes under X11 and Terminator

Screenshots

Credits

The themes Novel, Espresso, Grass, Homebrew, Ocean, Pro, Man Page, Red Sands, and Terminal Basic are ports of the themes of the same name included with the Mac Terminal application. All of Terminal's themes have now been ported, with the excption of 'Solid Colors' (random backgrounds, which iTerm doesn't support) and 'Aerogel' (which is hideous).

The scheme idleToes was inspired by the idleFingers TextMate theme and suggested for inclusion by Seth Wilson.

The scheme Zenburn was inspired by the Zenburn version created by Suraj N. Kurapati.

The scheme Symfonic was inspired by the color scheme used in the documentation for the Symfony PHP Framework.

The scheme Solarized Darcula was inspired by the color theme created by @rickhanlonii]. There are two screenshots below; one with a background and one without. The background image is included in the backgrounds/ directory and the image must be manually set on the profile's Preferences->Window tab. It's hard to see from the screenshot, but it looks great!

The theme Hurtado was found here.

The theme Mokokai Soda was found here.

The theme Neopolitan was created by Daytonn

The themes Solarized Dark and Solarized Light come from the official Solarized web site

The Obsidian theme was on my hard drive and I don't recall where it came from. If anyone knows, ping me and I'll link back to the author(s).

The theme Spacedust was created by mhallendal and ported to iTerm by Couto

The theme Mathias was created by mathiasbynens

The LiquidCarbon themes were created by markcho

The NightLion themes were created by Curvve Media

The Tomorrow themes were created by chriskempson

The Twilight theme was created by stefri

The Teerb theme was created by Teerb

The IR_Black theme was found here

The Misterioso theme was created by flooose

The Hybrid theme was found here

The Thayer Bright theme was found here

The Spring theme was found here

The Smyck theme was found here

The Cobalt2 theme was created by wesbos

The WarmNeon theme was ported from PyCharmby firewut

The SpaceGray theme was created by ryentzer

The Jellybeans theme was created by qtpi

The PaulMillr theme was created by paulmillr and ported to iTerm by me

The Harper theme was created by idleberg

The CLRS theme was created by jasonlong

The Dracula theme was created by zenorocha

The themes AdventureTime, AlienBlood, BirdsOfParadise, Ciapre, CrayonPonyFish, DimmedMonokai, Earthsong, Elemental, FishTank, FrontEndDelight, FunForrest, Grape, Highway, IC_Green_PPL, IC_Orange_PPL, Lavandula, Medallion, Ollie, Royal, SeaShells, Shaman, SoftServer, Sundried, ToyChest, Treehouse, Urple were created by zdj

The Japanesque theme was created by aereal

Iterm2 Themes

The Seti theme was created by jesseweed and ported to iTerm 2 by philduffy and slightly modified to make the ANSI blacks have a little more contrast

The Hipster Green and Jackie Brown themes were created by Unkulunkulu

The Chalk theme was created by achalv

The Pencil Dark and Pencil Light themes were created by mattly

The Flat theme was created by ahmetsulek

The Atom, Brogrammer, Glacier, and Darkside themes were created by bahlo

The Afterglow theme was created by yabatadesign

The Broadcast theme was created by vinkla Renault megane 2002 cd player manual.

The Arthur, N0tch2k, Pnevma, Square, and Wryan themes were created by baskerville

The Belafonte Day, Belafonte Night, Paraiso Dark, and C64 themes were created by idleberg

The 3024 Day and 3024 Night themes were created by 0x3024

The Argonaut theme was created by effkay

The Espresso Libre theme was created by jurgemaister

The Hardcore theme was created by hardcore

The Rippedcasts theme was created by mdw123

The The Solorized Dark Higher Contrast theme was created by heisters

The VibrantInk theme was created by asanghi

The Wez theme was created by wez

The Wombat theme was created by djoyner

The WildCherry theme was created by mashaal Mach desktop 3 0 48.

The Flatland theme was created by realchaseadams

The Neutron theme was created by Ch4s3 Postico 1 3 2 – a modern postgresql client centered.

Instalicious 1 1 1 – experience instagram with elegance. The Fideloper theme was created by Fideloper

The Galaxy theme was created by jglovier Ember 1 8 5 – versatile digital scrapbook.

Themes

The Later This Evening theme was created by vilhalmer Green in roulette.

If there are other color themes you'd like to see included, drop me a line!

The Slate theme was created by deneshshan

The SpaceGray Eighties and SpaceGray Eighties Dull themes were created by mhkeller

The Borland theme was created by delip

The Cobalt Neon theme was created by vasquex

The AtelierSulphurpool theme was created by atelierbram

The Batman, Spiderman, and The Hulk themes were created by pyrophos

The ENCOM theme was created by Josh Braun

The Floraverse theme was created by papayakitty

The Material and MaterialDark themes were created by stoeffel

The OceanicMaterial theme was created by rahulpatel

The AtomOneLight theme was created by iamstarkov

The Piatto Light theme was created by kovv

The DotGov theme was cinspired by the color palette used in the U.S. Web Design Standards

The Duotone Dark theme was created by chibicode based on simurai'sduotone-dark Atom theme

The JetBrains Darcula theme was created by vitstr

The Bright Lights theme was created by tw15egan

iTerm Color Schemes | iTerm2 Color Schemes | iTerm 2 Color Schemes | iTerm Themes | iTerm2 Themes | iTerm 2 Themes

This guide is targeted for those, who wants to have a nice UI in the terminal with the rich features.

Please, raise your issue if something strange happened.I'd like to improve this script, so it could work without any errors during the installation.

The Problem

Every time, I've re-installed my operating system, I spend around ~30 minutes to set up my terminal environment again.I bored of it, so I decided to make a list of all actions I doing, when setting it up, alongside with automatic script to do so, and share it with you all.

Screenshots & GIFs

They are available here.

Key Features

The script installs things related to terminal environment only:

  • Installs Command Line Tools, Homebrew, iTerm2, Fish, Fisher.
  • Installs Material Design color preset for iTerm2 and patched Meslo Nerd Font.
  • Theme bobthefish, which is based on popular agnoster.
  • Completions for brew, git, ./node_modules/.bin and others…

Installs a lot of useful plugins for Fish Shell:

  • bass plugin that makes easy to use scripts written for Bash Shell in Fish Shell.
  • Plugin done that notifies you when the process is finished. i.e. you can run npm install command and switch back into your browser. When npm install is done, you will get OSX notification.
  • fzy plugin adds a hotkey Ctrl+R that allows to show and search in your command history.
  • pj function allows to easily jump between your favorite directories. It installs with configured ~/Library/Projects folder, so you can jump to any of your projects by calling pj .
  • upto function gets you to a parent folder. I.e. you're inside a/b/c/d/e/, calling upto b will navigate you into a/b.
  • …and others, you can find the full list below in manual guide.

How To Setup

You can achieve the same setup as mine, by manually setting up the environment (following the guide below) or automatically by executing the installerinstall.sh.

Automatic Installation

Highly recommended to run the script below under Bash session in default Terminal.app.I can not guarantee proper installation outside of Terminal.app + Bash Shell.

Manual Installation

Command Line Tools

You don't need to install the whole Xcode for it.By executing the command below, you will get only the command line tools without heavy IDE and dependencies it take:

Homebrew

Homebrew is a software manager for MacOS.Its purpose is like the purpose of apt-get on Debian-based systems or yum on Fedora.You can install command line tools from there or even full-featured applications.

iTerm2
Install iTerm 2
  • Download and install iTerm2 (it has better color fidelity than the built in Terminal).

or install it via Homebrew:

Install Color Scheme

Get the iTerm color settings:

Biker gang games. 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.

Install Patched Font

Open the downloaded font and press 'Install Font'.

Set this font in iTerm2 (iTerm -> Preferences -> Profiles -> Text).

  • Regular Font -> 'Change Font'
  • Non-ASCII Font -> 'Change Font'

Restart iTerm2 for all changes to take effect.

Fish Shell
Install Fish Shell

Download and install Fish Shell.

or using Homebrew:

Install Fisher

Fisher is a plugin manager for Fish Shell.

Install Themes and Plugins

License





Publicité
Partager cet article
Repost0
Pour être informé des derniers articles, inscrivez vous :
Commenter cet article