Installation

This guide covers the complete installation process for Shadcn/UI Figma.

Prerequisites

Make sure you have:

• Figma Desktop App or access to Figma in your browser
• An active Shadcn/UI Figma license
• Internet connection for downloading files

Step 1: Download Your License

1. Log in to your account at shadcnfigma.io
2. Go to My Account > Downloads
3. Click Download Figma File for your plan
4. Save the .fig file to your computer

Step 2: Import to Figma

Option A: Desktop App

1. Open Figma Desktop App
2. Click File > Import
3. Select the downloaded .fig file
4. Choose your destination workspace

Option B: Browser

1. Go to figma.com
2. Click the Import button in your files list
3. Drag and drop the .fig file
4. Wait for the upload to complete

Step 3: Set Up Your Workspace

Once imported:

1. Duplicate the file - Never edit the original
2. Enable the plugin - Go to Plugins > Shadcn/UI Code Gen
3. Configure your theme - Update color variables in the Variables page
4. Test a component - Try copying a button to a new file

Plugin Installation

To use the code generation features:

1. In Figma, go to Plugins > Browse plugins
2. Search for "Shadcn/UI Figma"
3. Click Install (requires Pro license)
4. The plugin will appear in your Plugins menu

Verification

To verify everything is working:

• [ ] File opens without errors
• [ ] All components are visible
• [ ] Variables are editable
• [ ] Plugin responds to commands

Troubleshooting

File won't open?

• Make sure you have the latest version of Figma
• Check your license is still active
• Try downloading the file again

Missing components?

• The file may be corrupted - re-download
• Check you're using the correct version for your license

Plugin not working?

• Verify you have a Pro or Enterprise license
• Reinstall the plugin from the Figma community

Next Steps

• Browse Components
• Learn about Theming
• Figma Plugin