Skip to main content
Love the theme? Take Shades of Purple everywhere you code. The theme has been ported to terminals, editors, browsers, syntax highlighters, and productivity tools.

​
Editors & Terminals

VSCode

The flagship theme for Visual Studio Code

iTerm2

Beautiful terminal experience for macOS

Hyper

Electron-based terminal theme

Alacritty

GPU-accelerated terminal emulator

Konsole

KDE terminal emulator theme

Cygwin

Windows terminal environment

​
Ghostty Terminal

Ghostty is a fast, native, feature-rich terminal emulator that comes with Shades of Purple pre-installed!
To enable Shades of Purple in Ghostty:
  1. Open your Ghostty config file by pressing ⌘ + , (or your system equivalent)
  2. Add or update the following line:
theme = "Shades of Purple"
  1. Save and restart Ghostty
That’s it! Ghostty ships with Shades of Purple built-in.

​
Syntax Highlighting

HighlightJS

Web-based syntax highlighting library

Prism (React)

React syntax highlighter with Shades of Purple

Prism (CSS)

Pure CSS version for Prism

Code Surfer

MDX Deck code presentations

Bat

Cat clone with syntax highlighting
These syntax highlighters are perfect for documentation sites, blogs, and code presentations that match your VSCode setup.

​
Apps & Tools

Google Chrome

Browser theme for Chrome

Alfred

macOS productivity app theme

Slack

Team collaboration theme

WordPress

Admin dashboard theme

​
Installation Guides

  1. Download the iTerm2 theme file
  2. Open iTerm2 → Preferences → Profiles → Colors
  3. Click “Color Presets” dropdown → Import
  4. Select the downloaded .itermcolors file
  5. Choose “Shades of Purple” from the presets
  1. Open your ~/.hyper.js config file
  2. Add shades-of-purple-hyper to the plugins array:
plugins: ['shades-of-purple-hyper']
  1. Restart Hyper terminal
  1. Download the Alacritty theme file
  2. Copy the color scheme to your ~/.config/alacritty/alacritty.yml
  3. Restart Alacritty
  1. Visit the Chrome Web Store
  2. Click “Add to Chrome”
  3. The purple theme will be applied immediately
  1. Visit the Shades of Purple Slack repo
  2. Copy the color values
  3. In Slack: Preferences → Themes → Create a custom theme
  4. Paste the color values

​
Platform-Specific Tips

For the best terminal experience, use a font that supports ligatures:
  • Operator Mono (recommended for VSCode and terminals)
  • Fira Code (free, excellent ligature support)
  • JetBrains Mono (free, designed for developers)
  • Inconsolata for Powerline (great for status lines)
Example terminal font configuration:
"terminal.integrated.fontFamily": "'Operator Mono', 'Inconsolata for Powerline', monospace"
When using Shades of Purple with HighlightJS or Prism on your website:
  1. Import the Shades of Purple theme stylesheet
  2. The theme works best with a dark background matching #2D2B55
  3. For code blocks, use a container with background #1E1E3F
This ensures consistency with your VSCode setup.
The WordPress admin theme transforms your dashboard to match Shades of Purple:
  • Customizes admin menu colors
  • Matches editor syntax highlighting
  • Updates notification colors
  • Perfect for developers who live in wp-admin

​
Community Ports

Themed your favorite app with Shades of Purple?The community has created many unofficial ports. If you’ve created a port for another platform, share it on Twitter @MrAhmadAwais to get it featured here!

​
Consistency Across Platforms

All Shades of Purple ports use the same core color palette:
Color RoleHex CodeUsage
Background#2D2B55Main background color
Background Dark#1E1E3FPanels and sidebars
Foreground#A599E9Default text color
Contrast#FAD000Highlights and accents
Keywords#FF9D00Programming keywords
Strings#A5FF90String literals
Comments#B362FFCode comments
This ensures a consistent visual experience whether you’re coding in VSCode, running commands in iTerm2, or browsing documentation in Chrome.

​
Get More Themes

View All Ports

Browse all official Shades of Purple repositories

Color Palette

Use these colors to create your own port

Build docs developers (and LLMs) love

Get started for freeTalk to us