Theming your MacOS with Dracula

I'll walk you through how to turn your macOS setup—and your favorite apps—into Dracula theme. We'll cover everything from your terminal to your browser, code editor, and even Discord. Let's get spooky!

Step 1: Theming Your Browser & Web Apps

Stylus: The Powerhouse for Custom Styles

Stylus is a browser extension that lets you apply custom CSS themes to websites. It's available for Chrome, Firefox, and Edge. Once installed, you can grab Dracula themes for your favorite sites from userstyles.world or GitHub.

• Twitter/X: Modified Catppuccin into custom Dracula for Twitter.
  
• GitHub: Dracula for GitHub.
  
• YouTube: Dracula for YouTube.
  
• Reddit: Dracula for Reddit.
  

To install a style, just click the link, hit "Install Style", and you're done! You can also tweak the CSS if you want to personalize your look.

Step 2: Theming Your Code & Notes

Obsidian: Dracula Gemini

Obsidian is a powerful note-taking app for markdown lovers. The Dracula Gemini theme brings the Dracula palette to your notes, making your second brain look as good as it works.

Step 3: iTerm2 & Shell

iTerm2 + Dracula + Powerlevel10k + Oh My Zsh

iTerm2 is the go-to terminal for macOS power users. Pair it with the official Dracula theme, Powerlevel10k for a stunning prompt, and Oh My Zsh for plugin magic.

• Download the Dracula iTerm2 color scheme and import it via iTerm2 → Preferences → Profiles → Colors.
• Install Oh My Zsh: sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
• Install Powerlevel10k: git clone --depth=1 https://github.com/romkatv/powerlevel10k.git $${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/powerlevel10k
• Set ZSH_THEME="powerlevel10k/powerlevel10k" in your .zshrc.

Step 4: Discord

BetterDiscord + Refactor Midnight

BetterDiscord is a client mod that lets you add custom themes and plugins to Discord. For Dracula vibes, try Refactor Midnight and add your own custom CSS for extra flair.

/* DEMO CSS */
button[aria-label],
button.button-38aScr,
button.buttonWrapper-3YFQGJ {
  color: var(--primary) !important;
  fill: var(--primary) !important;
}

Step 5: Wallpapers

No theme is complete without a matching wallpaper. Here are some Dracula-inspired options:

Download

Download

Download

Download

Download

Download

Download

Download

Find even more at aynp/dracula-wallpapers.

Step 6: macOS UI Customization

SketchyBar & JankyBorders

For advanced users, SketchyBar lets you create a fully custom, scriptable macOS status bar. Pair it with JankyBorders for window borders that match your Dracula vibe. Check out community configs for inspiration.

Resources & More Dracula

• userstyles.world — Find and share user styles for all your favorite sites.
• Dracula for Stylus (Brave, gemini, google drive/docs, leetcode, whatsapp, wikipedia)

Dracula Color Palette

The Dracula theme color palette - reference: