Visual Studio Code's latest release v1.26 dropped today and it's filled with great new features. And there's a nifty new feature of Breadcrumbs.
What Are Breadcrumbs in the Context of VSCode?!
A breadcrumb navigation lets you jump to symbols and files in your workspace from the top without having to mess around with the file explorer — most helpful for small screens.
The editor now has a navigation bar above its contents - we call it Breadcrumbs. It shows the current location and allows you to quickly navigate between symbols and files. To start using breadcrumbs, enable it with the View > Toggle Breadcrumbs command or via the
breadcrumbs.enabledsetting.When using editor tabs (default), breadcrumbs are displayed in a separate row below the editor title. If you are not using editor tabs, breadcrumbs show as an interactive file path next to the title. More…
I love this new feature coz I will be using less and less of the explorer sidebar. More screen space for good old code. Enable them by this setting "breadcrumbs.enabled": true.
Ahmad Awais 🥑@mrahmadawais
🔥 TIP: VSCode.pro/TIP/15 — Latest release of 🆚@Code has a nifty new feature of Breadcrumbs. I like it. Press ⌘ + ⇧ + . to access it.
Details in the tips below:
✅ VSCode.pro/tip/15 (Enable breadcrumbs)
✅ VSCode.pro/tip/16 (Shortcuts)
🙌 RTs appreciated!05:37 AM - 14 Aug 2018
To interact with breadcrumbs, use the Focus Breadcrumbs command or press SHIFT (⇧) + COMMAND (⌘) + PERIOD (.) and use arrow keys ARROW KEYS (←/→) to move around.
🥖 VSCode Breadcrumbs Tips & Tricks
I have shared more details in the tips below:
- ✅ VSCode.pro/tip/15 → (Enable breadcrumbs in VSCode)
- ✅ VSCode.pro/tip/16 → (Shortcuts/Iteration tips & tricks)
Ahmad Awais 🥑@mrahmadawais🔥 TIP: VSCode.pro/TIP/16 — You can also interact with breadcrumbs without the picker for that press ⌘ + ⇧ + ; and to move around press ⌥ + arrow keys
Details in the tips below:
✅ VSCode.pro/tip/15 (Enable breadcrumbs)
✅ VSCode.pro/tip/16 (Shortcuts)05:37 AM - 14 Aug 2018
🦄 Shades of Purple v2.5 →
The new breadcrumbs feature is stylable and every good theme should have it styled or it would look weird. Shameless plug here, I am the author of a VSCode theme called 🦄 Shades of Purple → which is being used by ~15,000 developers.
I try to keep it updated with every single VSCode major release, which is why there are 50+ releases so far. In the Shades of Purple v2.5 update two major updates are:
- 🎨 Styles for VSCode Breadcrumbs
- 🗂 Styles for the upcoming VSCode Settings editor that's in preview at the moment, but it's styled in accordance with the 🦄 Shades of Purple theme →
Peace! ✌️
We're hiring for a Senior Platform Engineer and would love for you to apply. 
Top comments (21)
Great new feature from VS code. Thanks
Ain't it?! I like it. 💜👊
I agree with the other commenter somewhat, the article is hard to follow and I still don't really know what breadcrumbs do... But it is all ok because that theme is awesome at the end!!
Glad you liked the theme! 💯
This article is just a tip — you can read more about breadcrumbs here → code.visualstudio.com/updates/v1_2... there isn't much more to it.
oh That's very kind of you to say! 💯
Thanks for the heads up, definitely using it! 🙌 Hope it plays well with Ruby though, I still have to figure out my Ruby + VSCode config...
I moved my sidebar to the right side of the screen, and I love it. Maybe something you would like?
Some comments may only be visible to logged-in visitors. Sign in to view all comments.