_Raycast extension

Access your design system anywhere, directly from your Mac Spotlight!

This version was released on August 25, 2022

The goal of design systems is simple — to have all your design data in one place, immediately available when needed. This means having direct access to your tokens, assets, components, and even documentation without looking for it across multiple sources of truth. Supernova helps you do this already, but today we're pushing it to new heights.

Introducing the Raycast extension

We're incredibly excited to announce the result of our tireless exploration of how to get data to your users faster and easier. Documentation sites are great, but they still require users to go to the site and find what they're looking for. Starting today, there's a new way you can access your data.

What is Raycast?

From Raycast's website:

Raycast is a blazingly fast, totally extendable launcher. It lets you complete tasks, calculate, share common links, and much more.

It's also a replacement for your Mac Spotlight that adds incredible features that the default spotlight just doesn't have. As of today, one of them is the ability to access your design system data, anywhere, anytime. Here are some things that you can do with it.

Search your design system documentation

With the Supernova Raycast extension, your design system documentation never felt more accessible. You can just open your Mac Spotlight, select Search documentation, and directly access the contents of your docs. You can also open the documentations site if you want full experience, and even copy content such as snippets of code directly from the in-built documentation browser!

The documentation is also fully searchable, so no need to know where to find what:

Already, this is a big help to everyone trying to find data from the design system — but it is not all, far from it.

Access your design data

Using the extension you can access your tokens, components, and assets directly from Spotlight as well.

Accessing tokens

You can search your token library for all tokens you have defined, and see all their details. We've even added a lot of fun things, like WCAG accessibility check or automatically naming the token using the closest Pantone name — so you can call it Outer Space instead of Gray-1000 when boasting about Supernova extension to your friends!

You can also copy CSS code, variables, search for tokens, filter by category and so on. Whew!

Accessing assets

Next up, you can search for your assets and use them directly from your Spotlight!

Accessing components

Finally, best for last! We've added the possibility to search for your components and access all information connected to the Supernova component view!

Each component is actionable, so you can quickly access your other sources of data, like where it originated from Figma, what's the backing codebase, or your Storybook definition — it's up to you what information you want to show.

As such, clicking Open Figma component will open up Figma and find the component for you! Feels like magic!

Get the extension now!

Simply install Raycast and download the Supernova extension!

We're really excited about this as it shows the connection of Supernova to the broader ecosystem and we're just getting started. Over the next few weeks and months, you can look forward to many more integrations with tools you love.

Thank you for your support, we're having blast with every release we do for you!

With love and eternal gratitude,

Team Supernova