Academygetting started

Getting started in Figma

Learn how to effectively integrate and utilize the shadcn/ui kit in Figma, whether on a free or paid plan. This lesson guides you through importing, publishing, and using the kit to enhance your design projects with consistency and efficiency.

Instructions

Free / Professional Figma account

  1. Ensure that you are logged into your Figma account.
  2. If you're using the free or professional Figma plan, your copy of the UI kit will be duplicated directly to your drafts once you click the link in the PDF file you receive from us.

Organization / Enterprise account

  1. Ensure that you are logged into your Figma account.
  2. Ensure your Figma account has the permissions to move the files into your team workspace. If you are unsure, contact your team admin.
  3. Go to Drafts in your team and import the .fig file you receive from us.
  4. Move the file to your Figma workspace. Select the correct workspace, click the Move button.
  5. Go to the Assets tab. Open the library section and click Publish Library. Note that it may take a moment for Figma to publish all components. Once published, the UI kit becomes available across your team and projects, ensuring consistency and efficiency in your workflow.
  6. Go back to your files. Create a new design file and name it, or open an existing one where you want to use the kit.
  7. In the Assets panel, find your UI kit under Team Libraries and add it to the file.
  8. You'll now see components from the kit in your assets, ready to drag and drop into your designs.

And that's it. Your UI kit is now fully connected and ready to power your design projects. If you want to learn more on how to work with libraries in Figma, follow the official guide.

3 of 45