Customise Hyper terminal with HTML, CSS and JavaScript

lot of developers these days are spending so much time with their terminal, that it became a vital tool in the development workflow.

Since I use the terminal the whole day, I like to change it to my taste.

Lately, I was very happy to see that there is an open source project called Hyperthat is making a hackable terminal. They build it with nothing more than HTML, CSS and JavaScript.

You can change the style to your taste and spice it up with themes and plugins. For the big fans of oh-my-zsh on the mac terminal, you can continue to use this in Hyper 😎

Platforms

The Hyper terminal is only available for all platforms:

• Mac
• Windows
• Debian
• Fedora
• Other Linux distros (.AppImage).

Settings

There are a lot of things that you can change in the config file.

You’re wondering how to change the settings?

1. Open your ~/.hyperterm.js config file with your favorite editor.
2. Add theme-or-plugin-name to your plugins array. Like this: plugins: [‘plugin-or-theme-name’]

Themes

Just like all the editors we use, that has a lot of themes, Hyper also has a lot of themes. In this list, you find some cool ones!

• my current Cobalt 2 Theme: This theme is created by @wesbos and is also available for many other applications
• Star Wars Theme: Not that I would use it, but hé we are nerds, so Star Wars is a part of that!
• Solarized Dark theme: This theme is nice and clean and also used by many other editors.
• Monokai Deluxe theme: This theme is just like the Solarized used in many other editors. In my opinion 1 of the classics.
• MacOS theme: If you’re using a Windows or Linux and like the MacOS style of terminal, this is your theme!
• Hyper Flat2: Do I need to say more? This is completely in Flat style
• Clean: This theme is just very clean with nice colors!
• Atom One Dark: This is one of the themes that is used in the Atom editor, if you like Atom, this is your theme!

There is a much bigger collection of themes on Github in the Awesome Hyper repository

Plugins

You can also find a massive list of plugins on the Awesome Hyper repo. But here are a few that I like the most!

• Hyperterm-1password: If you’re using the 1Password manager for storing all your credentials, this plugin will integrate that into your terminal.
• Hyperterm-history: Want to have a history present based on your command, add this awesome plugin!
• Hyperterm-visor: With this plugin, you can open your terminal from any finder with a short-cut.

Hopefully, you like the Hyper terminal and if you have some cool themes or plugins to share, leave them in the comments 😎

Originally published on https://raymonschouwenaar.nl/customise-terminal-html-css-javascript-hyper/