How To Make An Amazing Custom Menu Bar For Your Mac With Sketchybar

A beginner's ultimate guide to making a custom menu bar for your mac from scratch with SketchyBar. This video covers all of the essential concepts to building a custom menu bar with SketchyBar by going through everything I did to put together my own setup. I hope you enjoy it and find it helpful!
✨ My 6k Wallpaper Pack For The Ultimate Setup: bit.ly/3ROe3st
✍🏽 Blog Post: bit.ly/47sywZy
💻 Code Repo: bit.ly/41UW4Fw
📧 Subscribe To My Newsletter: buttondown.email/josean
☕️ Help Support Me And The Channel: www.buymeacoffee.com/joseanma...
-- Other Useful Links --
Man Page For date Command: man7.org/linux/man-pages/man1...
Sketchybar Repo: github.com/FelixKratz/SketchyBar
Sketchybar Docs: felixkratz.github.io/SketchyBar/
Sketchybar Color Picker: felixkratz.github.io/SketchyB...
Sketchybar Setup Inspo: github.com/FelixKratz/Sketchy...
Sketchybar Plugins Inspo: github.com/FelixKratz/Sketchy...
⏰ Timestamps
00:00 - Introduction
01:28 - Install Homebrew & Dependencies
03:27 - Hide Default MacOs Menu Bar
04:09 - Start Sketchybar
05:22 - Modify Yabai Or Rectangle Config
06:33 - Install VSCode
07:16 - Sketchybarrc Intro
08:53 - Setup colors.sh
11:57 - Install SF Pro & SF Symbols
13:37 - Add calendar item
21:28 - Add volume item
25:43 - Add battery item
28:22 - Add CPU item
30:33 - Install sketchybar-app-font
32:55 - Add front_app item
36:22 - Add spaces to the bar
39:56 - Add app icons to spaces
42:58 - Add media/music item
46:33 - Changing colorscheme & wallpaper
47:31 - Conclusion

[@joseanmartinez]

Hey guys! Hope you enjoyed it! If you uninstall sketchybar note that you should also stop the service with “brew services stop sketchybar”.

[@dev_insights783]

Have you ever tried archlinux( btw I use arch)

[@tapashreepradhan1769]

bro comes in with the most amazing mac customization vids EVER. lots of people just tell you to download apps but only josean comes up with ways to completely customize AND are also open-source. LOVE IT.

[@zenbrandon]

The return of the king!

[@nilo866]

i think u have the best vids in terms of learning how to make your own mac look unique :)

[@ThisFiniteWorld]

awesome video, I was looking something like i3 for macOS and you saved the day, thank u

[@jagraj7015]

cool vid as always dude!

[@mrnezbitt]

Thanks for your videos and blog posts too! This, your tmux and nvim videos have helped me get to a place where I love my setup now! These videos were so helpful to me in the beginning, as a way to get started with such tools. With these videos and your blog posts I would have lacked the confidence to begin to make my own setup. With some trial and error along the way of course!

[@rest-dx9zn]

Thanks for sharing!

[@johngrade9817]

Awesome thanks!

[@rsosa3632]

Buen trabajo👌, como explicas es muy facil de aprender. Great job appropriate the time you're putting into these videos to teach us a better way to customize our Macs

[@jeanneves177]

AWESOME!

[@faustozampa]

You are such a good content creator, really like your content and shell config. I will you all the best. Subscribed and turned on the notifications. Thanks dude.

[@lesamir2010]

Masterclass!

[@bobbyLovesTech]

It looks very similar to Polybar in terms of setup etc... Will definitely gives this a go!

[@adrianvalenzuelacodesstuff67]

Sooooo coool this tutorial..just went to the coffee shop to finish configuring it...brings back Linux vibes for sure lol

[@razielamadorrios7284]

Hi Josean! Great video, I really enjoyed it. Everything well explained and documented, huge fan. Additionally, I bought your wallpapers, great fan of contributing to the community and Open source community. Please keep this great job. I looking forward for your next video mate!

[@joseanmartinez]

Hey! I really appreciate your feedback and support. Happy to hear you enjoyed the video! Hope you find the custom menu bar as useful as I have lately 🚀

[@user-bf7td1gn3t]

It's funny how you always upload about something I get interested in about macos customizing. Lately I've been trying to find solutions to remove the min max exit buttons in the titlebar of apps, but I just couldn't find anything since it's not something that everyone needs and it's also not something easy to achieve. If you ever find a way to do it could you maybe make a blog post about it (not a video since it would be a pretty short one lol). Thanks for the great videos btw!

[@zaid5424]

Unfortunately, this functionality is not available for every app, but you can edit the config settings of different terminals (iTerm2 and Alacritty), and change the usercss file in firefox to remove the buttons from these applications

[@mr.researcher1525]

Love..from..nepal. 🇳🇵

[@bennforlife]

I like the idea of this, especially having a glance at the apps open in each space, but there are certain menu bar apps that don't seem compatible with this such as iStat and various pomodoro apps that I'd like to be able to see at a glance. I've also been looking for a way to display average cpu temp that iStat provides for Silicon chips.

[@bassamsaleh8034]

awesome video

[@joseanmartinez]

Thanks!!

[@tachibanataki8743]

Just curious Josean, what's your typing speed? Nice video btw

[@petaro]

Where did you get the case for your Corne? I really like tenting system!

[@Ningishzidd4]

Awesome! Can I ask what app you're using for showing/casting the keys in the low right corner? Is it Keystroke Pro?

[@OmniShot]

Is there a way to do a list of bluetooth devices on this bar ./ create clickable buttons? Good vid thanks!

[@darkjo4335]

Hey bro, thank you for your tutorial; it was excellent as always. However, the default parameter for the sketchybar, such as the height, has been changed from 32 to 40. This change was made in v2.20.1.

[@sorvex9]

40:50 what is that neovim plugin u use to create a file on your cursor ? Looks like it also uses telescope

[@imrongamidli5190]

We need your case for corne drop it😅

[@tranlynhathao5393]

I followed the steps as you instructed, but only a few places show icons and the rest don't display, could you tell me the reason? Thank you!

[@mannyfay2524]

Thanks for the video. Can you tell my please, how I create the Yabai-space at the bottom instead at the top of the screen?

[@mannyfay2524]

Got it! Just switch the numbers! Set Sketchybar on bottom of the screen: yabairc -> `yabai -m config external_bar all:0:32` sketchybarrc -> `sketchybar --bar position=bottom height=40 blur_radius=30 color=0x40000000`

[@vaibhavchauhan8755]

Which is the color scheme used in iterm?

[@Ematolah]

oi mate you know we love ya right? f off and keep goin mate best customizations ive ever seen on youtube!

[@0xIg_dev]

For some reason my cpu percentage is in 0% all the time, something is wrong with my code maybe. Awesome video Josean!

[@joseanmartinez]

Thanks for the feedback! Not sure why your CPU percentage might be showing 0%, but I did make a mistake with the code in the blog post where the backslashes in the code weren't showing. That's fixed now. Did you follow along with the blog or did you clone the repo? So that I know better what might be causing the issue.

[@nanguyen9812]

do you guys get any trouble with mac os newest(14.5), since update, i cannot use hdmi if i have yabai/ sketchybar/ or skhd,...., now when uninstall all of them, i still can only use external monitor if i close mac at clamshell please, Josean helpp meeeeeee

[@lukaskris3484]

bro my spotify music not playing just icon sound, how to integrated with spotify?

[@manuelfarzini]

wow

[@SilverSeleucid]

upon switching back and fourth between different desktops the bar briefly disappears

[@farzadmf]

When you change spaces, I guess you're using Yabai. It seems like there's no delay when you change spaces, is that the case? How can you do that? I tried "reducing animation" in settings, but it doesn't do the trick

[@eirikre]

aaand then rewrite in lua:))

[@MrJAN05]

Estoy aqui esperando que te lleven a @Chente

[@tGoldenPhoenix]

36:19

[@darkjo4335]

When I reload SketchyBar, I encounter several problems: The battery icon only appears when I plug in the charger. The sound icon only appears when I start to decrease or increase the volume. The date icon is present; however, the associated label, i.e., the date and time, only appears after 20-25 seconds. Regarding the labels for windows, it displays 10 each time, and I have to switch desktops for it to show the correct number of actually open desktops. Does anyone have a solution?

[@darkjo4335]

It was a problem in my sketchybarrc file. Incorrect type 'ketchybar --update' instead of 'sketchybar --update'

[@unitedastronomer]

i just wanna have an aesthetic menu bar :(

[@fabiohinojosa2713]

My cpu read is 0% the whole time, why is this? How can I fix it?

[@joseanmartinez]

Not sure why that's happening. Did you clone the repo or did you follow along with the blog post? I made a mistake in the blog post code where the backslashes weren't showing. Not sure if that might be related to your issue or not. Thanks for the feedback, I really appreciate it!

[@fabiohinojosa2713]

I was able to fix the backlash problem, also i found that is important to note that if there is a space after each backlash the code won't run properly @@joseanmartinez

[@fabiohinojosa2713]

I followed the blog post, I was able to fix it by copying the code from the repo. There must be a small bug in the blog@@joseanmartinez

[@ali_ait_rhou]

can you offer a free wallpaper i really like this

[@darianmorat]

hate u windows! But I cannot leave u...

[@Solsenderz]

I tried to set up sketchybar once, but I don't get it, why is it cool?

[@adrianvalenzuelacodesstuff67]

Displays information in an aesthetic manner

[@buttstabber]

Creating so many “.sh” files and setting them as executable would create so many security implications for your mac. Wouldn’t it?

[@damnhatesyou]

Only if those .sh are themselves secure. Like any software, you have to hope that they are doing the right thing. I don’t know if this project is open source or not, but if it is it’s more likely to be safer and you can check it yourself if you know how to code

[@NotSeggsySage]

Disguised linux user

[@fatpig2246]

I tried uninstalling it with 'brew uninstall sketchybar' and 'brew untap FelixKratz/formulae'. But it left a shadowy bar at the top. I also restarted it. Any idea how to fix that? Edit: It automatically got fixed after 4-5 minutes

[@joseanmartinez]

Stop the service by running “brew services stop sketchybar”