By Akinjide Bankole
This tutorial is out of date and no longer maintained.
Hyper is a terminal built on web technologies, based on JavaScript, HTML, and CSS providing a beautiful and extensible experience for command-line interface users. Hyper achieves a lot of its speed and functionality thanks to the power of hterm underneath, the terminal emulator of the Chromium project.
If you’re just getting started with Hyper terminal I’d suggest you definitely head to Hyper website, they have an extensive installation guide and usage documentation
Today we’ll be looking at the best packages and themes to make our Hyper terminal much cooler.
Important words
are highlighted....
.This project requires Node.js v6.11.0 LTS or higher and Hyper installed. Now that you have completed the prerequisites, let’s get started!
Hyper primary focus has been around speed, stability, and the development of API for extension authors. Extensions are available on npm and you can search hyper
using the npm search command.
- npm search hyper
Then edit ~/.hyper.js
and add it to plugins
module.exports = {
// ...
plugins: [
"hyper-ayu",
"<other-plugins-here>"
]
};
Fully reload Hyper COMMAND+SHIFT+R
and Hyper will show a notification when your modules are installed to ~/.hyper_plugins.
config: {
MaterialTheme: {
theme: 'Palenight',
backgroundOpacity: '0.4',
accentColor: '#64FFDA', vibrancy: 'dark'
}
},
plugins: [
"hyper-material-theme"
]
// ...
plugins: [
"hyper-snazzy"
]
// ...
plugins: [
"hyper-materialshell"
]
// ...
plugins: [
"hyperterm-monokai"
]
// ...
plugins: [
"verminal"
]
// ...
plugins: [
"hyper-solarized-dark"
]
// ...
plugins: [
"hyper-dracula"
]
config: {
pokemon: 'gengar', // Define your favorite pokemon theme
pokecursor: 'true', // Activate your theme's pokecursor
pokemonSyntax: 'dark', // Define the color of the terminal tabs
unibody: 'true', // Define the color of the Hyper window header
poketab: 'false', // Deactivate your theme's poketab
},
plugins: [
"hyper-pokemon"
]
A fun plugin that shows a red rocket ship launching from the right-bottom corner of your terminal whenever you push code to GitHub.
// ...
plugins: [
"gitrocket"
]
This plugin turns your Hyper terminal on power mode, blasting sparks as you type away.
// ...
plugins: [
"hyperpower"
]
A status line plugin that shows useful system information such as free memory, total memory, battery level, system uptime, CPU usage, hostname, and network upload/download speed.
// ...
plugins: [
"hyperline"
]
This plugin allows opening new tabs with the same current working directory as the current tab.
// ...
plugins: [
"hypercwd"
]
This plugin opens your terminal window using a system-wide configurable hotkey. It’s especially useful on macOS to toggle between previously active application and your Hyper application.
// ...
plugins: [
"hyperterm-summon"
]
This statusline plugin shows clickable and useful information when working with a Git-enabled project.
// ...
plugins: [
"hyper-statusline"
]
My favorite, if you use Spotify this plugin displays currently playing song and a play/pause at the bottom of the terminal but the position of this bar can be configured.
// ...
plugins: [
"hyper-spotify"
]
This plugin enhances your terminal with pane navigation, just like you’d find with VIM. It supports navigating panes with arrow keys, jumping to a specific pane using digits, and temporarily maximizing a pane.
// ...
plugins: [
"hyper-pane"
]
This plugin enhances your Hyper terminal tab, showing tab icons, colors, and activity indicator.
// ...
plugins: [
"hyper-tabs-enhanced"
]
This plugin allows setting Hyper terminal window transparency, background color, and on macOS a dropdown menu for setting vibrancy and transparency.
// ...
plugins: [
"hyper-transparent"
]
Tabs reordering makes grouping similar tabs possible, this plugin enables that feature and provides configurable keyboard shortcuts.
// ...
plugins: [
"hyperterm-tabs"
]
I have been getting more familiar with not only Hyper, but packages and themes built for Hyper, I hope you feel this way too. Any combination of theme and package can be used so keep combining or switch every week!
What are your favorite themes, packages, or theme and package? I’m looking forward to your comments, questions, or thoughts in the comments below. I would love to see them.
And oh yeah, have fun!
Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
Enter your email to get $200 in credit for your first 60 days with DigitalOcean.
New accounts only. By submitting your email you agree to our Privacy Policy.