Skip to main content
If your component library lives on your machine rather than in a connected repo, you can upload it directly. Magic Patterns reads your component source so generated designs use your real code and import paths.

Upload your code

1

Open the Local Code connector

From your Design System, open the linked-sources panel (during onboarding, or later from Access & Settings) and choose Link Local Code.
2

Add your zipped export

Drag and drop, or click to browse for, a zipped export of your component library. Supported formats are .zip, .tar.gz, and .tgz. You can add more than one file.
3

Choose subfolders (optional)

After a file uploads, you can browse its contents and select specific subfolders to import (for example the folder that holds your components) so we only scan the relevant code.
4

Done

Once your uploads finish, continue. Magic Patterns scans the code and proposes the components, colors, and tokens it finds for you to review.
Linking GitHub instead keeps your Design System in sync with a repo you already maintain. Use a local upload when the code isn’t in a repository Magic Patterns can reach.

What’s Next?

GitHub

Link a repository to import components and styles straight from your code.

Importing overview

See every way to bring an existing design system into Magic Patterns.