Related Videos

• Get started with Team Library

  Before you Start

  Who can use this feature

  Users on any team or plan can use a Team Library and publish Styles.

  Users on Education, Professional, and Organization plans can publish Components.

  Users with Edit access to a file can publish a Team Library.

  Styles and Components live in the files they are originally created in. To reuse Styles and Components across your files and Projects, you can publish them to your Team Library.

  What is Team Library

  Components are UI elements that can be reused across your designs. They help you to create and manage consistent brands or themes across projects.

  Styles are sets of properties that can be applied to objects across your Team's designs. You can use Styles to define attributes for Color, Text, Stroke, Background Color, Effects and Layout Grids.

  You can use the Team Library to access these resources across your Team files and Projects. This allows you to maintain a consistent brand and style, at scale.

  How does it work?

  • Create the Styles and main Components that define your brand.
  • Publish these Styles and Components to the Team Library. 
  • This allows everyone in your Team to view and use them across their files. Components can be access via the Assets panel, Styles from the Properties Panel.
  • You can continue to develop, iterate and refine your Styles and Components, publishing your changes to the Team Library. We keep a record of your changes in a detailed Version History.
  • Designers and collaborators can quickly update any affected Styles and Components. This ensures they're always up to date and using the latest version.

  Help Articles

  • Publishing Components and Styles to Team Library
  • Accepting Updates from your Team Library
  • Enabling and Disabling Team Libraries
  • Removing files and Components from Team Library

  Frequently Asked Questions

  Can I use Team Libraries in a Starter team?

  You can publish and use Styles when in a Starter team.

  You can also publish Components to the Library. You will not be able to use Components in other files until you upgrade to a Professional team.

  Where can I find the Library modal?

  Use the Team Library icon in the Assets tab of the left sidebar: 

  Or, open the Library modal using the Keyboard Shortcuts:

  • Mac: ⌥ Option  3
  • Windows: Ctrl + 3

  How do I enable Libraries for a specific file?

  You can enable Team Libraries for everyone in that file from the Library modal.

  You can access the Library modal by clicking the Team Library icon in the Assets Panel. Find out more in: Enabling and Disabling Libraries. 

  How do I remove a file from my Library?

  Disabling a Library will only remove those Components from the Assets Panel. You will also need to leave the file where the Main Component lives.

  Learn more about removing files and Components from your Team Library.

  Some of my Components or files are missing, or out of date.

  If you have created or updated Components - without publishing any changes - your Team Library may be out of date.

  You can find unpublished Components in the Private to this file section of the Assets panel: 

  Find out more in the Publishing Missing Components to your Team Library section.

  Can I copy or move Styles and Components to other files?

  It's not possible to move Components to a new file. Moving Components breaks the connection between the Main Component and any existing Instances.

  Copying a Component from one file to another will create an Instance of that Component. To make this a Main Component, you would need to turn that Instance into a Component. This would be separate to the original Main Component.

  You can move Styles between files without breaking the connection. To move a Style from its original location, to your current file:

  1. Click on the Style in the Properties Panel.
  2. Click the Edit icon to view the Style in more detail.
  3. Select Move Main Style into this file from the options.
• Publish styles and components to a library

  Before you start

  Who can use this feature

  Publishing styles is supported on any team or plan. Publishing components is only supported on Education, Professional, and Organization teams and plans.

  Anyone with Can edit access to the file can publish styles and components to a library.

  New to components and libraries? Learn more about components → Learn more about libraries →

  When you first create styles and components, you can only access them in file you created them in. To use them in other files or projects, or share them with collaborators, you can publish them as a library.

  Libraries allow you to publish any styles and components you create a shared repository. Every file you publish corresponds to a single library.

  You, and other members of your team or organization, can browse published libraries via the libraries modal. Access the libraries modal from your drafts, as well as any team or organization files.

  Caution: Libraries are a paid feature. If you're working in your drafts, or are part of a free Starter team, you won't have access to all the functionality of libraries.

  You can still create and use components on a Starter team, but you can't publish them to access them in other files.

  • Publish styles in your drafts, or on any team or plan.
  • Publish components in Professional or Education teams, in Organizations.

  Publish styles and components

  You can choose exactly which styles and components you want to publish, by creating private components in your file, or removing styles and components during the publishing process.

  Every time you publish to your library, you'll be prompted to add a description. This allows you to communicate decisions and changes to the people who use your library. Figma will include this description alongside a new checkpoint in the file's version history. Descriptions will also be displayed when accepting updates from a library.

  Open the Library modal

  The library modal allows you to find, view, enable, and publish libraries. You'll publish any new libraries from the libraries modal, as well as any changes or updates to existing libraries.

  There are a few ways to access the library modal from within a file:

  • 1

    Editor toolbar

    1. Click on an empty spot in the canvas to deselect.
    2. Click the next to the file name in the toolbar.
    3. Select Publish styles and components from the options.

    

  • 2

    Assets panel

    1. Click on the Assets panel in the left sidebar.
    2. Click the to open the library modal.

    

  • 3

    Use the keyboard shortcut

    • Mac: ⌥ Option 3
    • Windows: Alt 3

  Tip! If you're a team or organization admin, you can choose which libraries are available to members by default. Learn how to enable libraries in teams and files →

  Publish to library

  To publish styles and components to a library, you will need to open the library modal from the file where they live.

  1. Open the Library modal via any of the methods above.
  2. In the Current file section, click the Publish button to publish the file.
  3. Add a description of the library's purpose, or any decisions or changes, using the field provided. This description is shown in Version History, and when accepting updates.
  4. To review the styles and components, click the arrow next to Styles and components heading.
  5. To remove any styles or components, right-click and choose Remove from library.
  6. When you've finalized your styles and components, click the Publish button. Figma will show a notification to confirm your file has been successfully published.

  

  Note: If you are a member of an Organization, you can also choose to share the library with your organization. This will allow other members of the organization to find and use styles and components from this file.

  Check the box next to Allow any member of organization to access this file before you clickPublish. Learn how add and remove libraries in an organization →

  Create private components

  If you have components that you don't want to share, or are still a work in progress, you can make them private components. There are two ways to create private components:

  • 1

    Add a prefix to the component name

    To prevent Figma from publishing your Components, you can add a prefix or modifier to the component's name in the layers panel.

    Figma will skip over any components using this modifier and exclude them from the publishing process. Figma will also list them in the Private to this file section in the Assets panel and the library modal.

    • Add a period . in front of the component layer's name.
    • Add an underscore _ to the beginning of the component layer's name.

    

    Note: If you add a period or underscore after a component has been published, Figma will remove it from your library the next time you publish changes to the library.

    If you want to publish these components at a later date, you will need to remove the prefix and then publish the components individually.

  • 2

    Remove via the assets panel

    1. Click on the Assets panel in the left sidebar.
    2. Right-click on the component in the list.
    3. Select Remove from library from the options.
  • 3

    Remove during the publishing process

    You can also remove components from the library modal during the publishing process.

    1. Open the library modal using any of the entry points above.
    2. Click the arrow next to Styles and components to view a list of included styles and components.
    3. Right-click on the component in the list and select Remove from library.

  Publish updates to a library

  If you make changes to a published style or component, this will only apply those changes to instances in the current file. If you want those changes to be reflected in your library, you will also need to publish those changes to the library.

  Figma will let you know if there are any updates that need to be published:

  • A blue dot will appear on the icon in the Assets panel of the left sidebar.
  • A toast notification with a prompt to Publish changes to your team library.

  Clicking on either of those options will open the library modal and allow you to review and publish your changes.

  Publish individual styles and components

  If you are missing styles and components from a published file, or want to add more styles and components, you can publish these individually.

  The fastest way to do this is via the Assets panel in the left sidebar.

  1. Click on the Assets tab in the left sidebar or use the keyboard shortcut:
     • MacOS: ⌥ Option 2
     • Windows: Alt 2
  2. Scroll down to the Private to this file section, which will list any components that exist in the file, but haven't been published.
  3. Right-click on the component and select Add to Library. If you have made the component private using the . or _ prefix, you will need to remove this.
  4. Figma will notify you that your updates are successfully published.

  

• Accept Updates from Team Library

  Before you start

  Who can use this feature

  Users on Education, Professional, and Organization, plans can accept any update from a Team Library. Users on a Starter Team plan can only accept Style updates from a library without any Components.

  Users with Edit access to a file can accept updates from a Team Library.

  New to Components? Check out our Getting Started with Components and Getting Started with Team Library articles.

  We will notify you of any changes made to Components or Styles you're using. This allows you to keep your designs up-to-date.

  Team Library Notifications

  When a change has been published made to your Team library, you will receive a notification. You'll receive a notification when:

  • New Components or Styles are available from the Team Library.
  • Updates are available for Components or Styles you are using.

  The notification will appear on any files that include those Styles or Components.

  You'll see the notification in the bottom-right corner of your screen. A blue dot will also appear on the  Team Library icon in the Assets Panel:

  You can then choose to Review Updates or Dismiss a Notification.

  Note: We won't notify you when you remove Components or Styles from a Team Library. You can continue using that Style or any Instances, but you won't receive any further updates.

  Review Updates

  You can then choose to review any updates. This allows you to apply those changes to any Styles or Components you're using.

  1. Click Review from the notification: 
  2. Or, click on the  Team Library icon in the Assets Panel: 
  3. Go to the Updates tab in the Library modal.
  4. Figma displays a list of Components and Styles that have been updated, with a description of the changes if one was entered when the update was published.
     1. Click Update next to an individual item to accept those changes.
     2. Click the Update all button in the bottom-right corner of the modal.
  5. We will apply those changes to any Styles or Instances you are using.

  Dismiss a Notification

  You can also choose to Dismiss the notification and continue to use the Instances in their current state.  You can then review and accept any changes at a later date. 

  

  Note: You should also be aware of the following:

  • We will prompt you to update your Styles and Component each time you open an affected file.
  • All Instances will remain connected to the Main Component, even if they are out-of-date.
  • You can accept these changes to Team Library at any time by clicking on the Team Library icon. The notification badge will remain there until you have reviewed or accepted the changes.
• Remove a file from your Library

  Before you start

  Who can use this feature

  Users on any plan

  Anyone can leave a file they have a role on.

  If you no longer want to have access to a specific file in your Library, you can remove it.You will need to leave the file where the main Component lives to remove it completely.

  If you only disable the Library, Figma will remove those Components from the Assets Panel. You will still see those Components in searches.

  Do you own the file and want to remove it from your Team Library? Check out our Remove a file from your Libraries article.

  Locate the file

  Open the file a Component lives in using the  Go to Main Component link. You can find this in a few places.

  In the Canvas

  1. Select the Component in the Canvas. 
  2. Find the Instance section of the Properties Panel.
  3. Click Go to Main Component link.
  4. Figma will open the file where the Component lives.

  Assets Panel

  1. Right-click on the Component in the Assets Panel.
  2. Select Go to Main Component.
  3. Figma will open the file where the Component lives.

  Note: If you haven't used the Component in your file, you can temporarily add the Component to your file. This will allow you to use the Go to Main Component link to access the file.

  Leave the file

  1. Open the file where the Component lives.
  2. Click the Share button to open the Sharing modal.
  3. Find your name in the list of collaborators.
  4. Click on your current access level and select Leave from the options.
• Unpublish a File from Team Library

  Before you start

  Who can use this feature

  Users on any plan can publish Styles. Only users on Education, Professional, and Organization plans can publish Components.

  The Team Owner or Team Admin can remove a published Library.

  New to Components? Check out our Getting Started with Components and Getting Started with Team Library articles.

  If you are the file owner or creator, you may wish to remove your file from the Team Library. To do so, you will need to unpublish the file.

  1. Open the file you want to remove from Team Library.
  2. Go to the Assets tab and click on the  Team Library icon. Or, use the Keyboard Shortcuts:
     • MacOS: ⌥ Option - 3
     • Windows: Ctrl + 3
  3. Click on the Current File to view the Library.
  4. Click the Unpublish button.
  5. Click Remove File from Library to confirm.
  6. We will remove the file from your Team Library. Team Members will no longer receive updates from Components in this file.

  Note: A Team member can still use Instances from an Unpublished library. They will no longer receive any updates made to those Instances.

• Remove styles and components from a library

  Before you start

  Who can use this feature

  Supported on Education, Professional, and Organization plans

  Anyone with can edit can remove styles and components from a library.

  New to components? Check out our Getting Started with components and Getting Started with Team library articles.

  There are a couple of ways to remove a style. You can simply remove it from a library or delete it entirely.

  In this article, we'll cover removing style and components from a published library. To tidy up your design systems you can:

  • Remove unused styles and components
  • Remove out-of-date or degraded components

  Are you a member of an Organization? Design System Analytics allow you to track component usage, including when components are detached.

  Remove styles

  To remove a style from your library, you will need to unpublish the style from library. You can only remove a style from the original file, where the style currently lives.

  You can access the original style from any object that is currently using it:

  1. Select an object in the canvas that uses that style.
  2. Click on the style in the right sidebar
  3. Click the icon to edit the style.
  4. Click Go to style definition to open the style in the library.

  You will also see an option to Move style definition into this file. This allows you to edit or delete that style without leaving the current file.

  Moving a style removes it from the original file. If you re-publish the original file, the style would no longer be included.

  Remove a style from a library

  You can remove a style from a library without deleting the style itself. You can only do this from the original style, the style definition.

  1. Open the file where the style lives.
  2. Press Esc to clear your selection in the canvas.
  3. Click the icon next to the file name to open the menu.
  4. Select Publish styles and components to open the library modal.
  5. Click on the styles and components header to expand.
  6. Right-click on the style and select Remove from library.
  7. Repeat for any other style you want to unpublish.
  8. Click Publish to apply your changes and remove the styles.

  Delete a style

  You can view Local styles in the right sidebar, when you select nothing in the canvas. Click an empty spot in the canvas or press Esc to deselect.

  To delete a style entirely:

  1. Select one or more styles. Use Shift + click to select a range styles, or Command / Control + click to select multiple non-adjacent styles.
  2. Select Delete style or Delete all from the options.
  3. Figma will remove the style and you will no longer be able to use it. Any objects using that style will keep their properties, but are detached from the style.
  4. Publish the changes to your Team library.

  Remove components

  You can remove components when you publish changes to your Team library. Or, from a library you have already published. You can only remove components from the file they originate from.

  1. Open the file where your component lives.
  2. Open the Assets panel in the left sidebar.
  3. Right-click on the component and select Remove from library.
  4. Figma will move the component(s) to the Private to this file section.
  5. Publish the changes to your Team library.

  Tip! You can also quickly remove a component from your Team library via the Layers Panel. Add a period . to the beginning of the component's name. Learn more in our Create Private components article.

  Note: You can open the file for any component from any file with access to those components. Right-click on an instance of that component in the canvas and select Go to Main component.

• Add and remove libraries in an Organization

  Before you start

  Who can use this feature

  Anyone in a Figma Organization Plan

  Any member of an Organization can publish styles and components to the Organization, or a team in the Organization. Members will need can edit access to files to publish them.

  Only Organization Admins can choose default libraries

  New to Components and Libraries? Learn more about getting started with Components →

  Styles and components live in the files you created them in. To access and reuse these in other files, you can publish them to a library. This allows you to maintain a consistent brand and style, at scale.

  In an Organization, you can publish files to a team in the Organization, or to the entire Organization.

  At Figma we call these libraries, but you can think of these as Design Systems. Libraries allow you to improve access and adoption of your Organization's design system.

  We’re passionate about design systems at Figma! Learn more about Building your design system in Figma. Find more design system resources at DesignSystems.com

  Publish a library

  Build collections of styles and components to reuse in your designs. Publish your styles and components to a team, or share them with your entire Organization.

  Use the file's link sharing settings to control who can view and edit files in your Organization. You can do this when you first publish the library, or once you publish the library.

  1. Open the file in the editor.
  2. Open the Assets panel in the left sidebar.
  3. Click the to open the Library modal.
  4. Click Publish next to the Current file.
  5. Enter a summary of your changes in the field provided.
  6. To publish to the Organization, check the box next to Allow any member of Organization to access the file. Leave unchecked to publish to the team only.
  7. Click Publish to confirm.

  Choose default libraries

  Encourage adoption of your design system by enabling default component and style libraries.

  When you enable a library in an Organization, Figma will make styles and components from that library available in any Organization files.

  • Select styles in the style picker for any relevant properties.
  • Select colors from any styles in the palette of the color picker.
  • Access components in the Assets panel of the left sidebar.

  All members of your Organization will be able to use styles and components from these libraries. However, you will need to give guests access to the library file to allow them to use those styles and components.

  Only Organization Admins can choose default libraries for the Organization. Members can still enable libraries for specific teams and files in an Organization.

  Learn how to choose default libraries as an Organization Admin →

  Tip! Track how members of your Organization are using components with design system analytics. Learn more about library analytics →

  Remove libraries

  You can control which libraries you share with your Organization. Remove any libraries you don't want to share with the rest of the Organization.

  You will need to unpublish the file, and change the link sharing settings to prevent members from accessing the file.

  Unpublish the file

  1. Open the file you want to remove.
  2. Open the Assets panel in the left sidebar and click [ICON].
  3. In the Library modal, click on the library in the Current file.
  4. Click the Unpublish button at the bottom of the modal:.
  5. Click Remove file from Library to confirm.
  6. Figma will return you to the file. The status bar will indicate that we have removed the file from the Library.

  Update link sharing

  Adjust the file's link sharing settings to prevent members of the Organization from finding and using the file.

  1. Click the Share button in the menu bar.
  2. Click the next to the existing link access. This will be set to Anyone at Organization.
  3. Select Only people invited to this file from the options.
  4. Members of the Organization won't be able to access the file. The file will still be available to any members of the team, or anyone with a role the file.

  Learn more about sharing files in an Organization →

• Track library and component usage

  Before you start

  Who can use this feature

  Supported on the Figma Organization plan.

  Any member of an Organization can view Design System Analytics. Members can only see data for libraries they have at least can view access to.

  Share libraries in a team or across your entire Organization. Track how members of your Organization are using libraries and components with design system analytics.

  • Find out which components in a library are popular
  • Identify components that are detached often
  • See how collaborators are using variants
  • See which components in a library members aren't using
  • Compare adoption between two libraries
  • See which teams are using each library
  • Find examples of components so you can see how their used and supplement documentation

  Note: Figma only includes libraries a member has at least can view access to in these results. You will not be able to track component usage within another member's Drafts.

  View library analytics

  Any member of an Organization can view library analytics.

  1. Open Figma in the file browser.
  2. Click on the Organization name in the sidebar.
  3. Select the Libraries tab to view an overview of all libraries in the Organization:
  4. View a summary of analytics across all libraries:
     • Total Teams: The total number of Teams in the Organization. This includes Open, Closed, and Secret Teams.
     • Teams with Libraries: How many teams in the Organization are using shared libraries.
     • Total Libraries: Total number of libraries in an Organization. This includes libraries shared across the entire Organization, or within a specific tTeam.
     • Total components: The total number of main components in an Organization's libraries.
     • Total Styles: The total number of styles in an Organization's libraries.
  5. Use the search bar to find a specific library.
  6. View a list of all libraries shared within teams or across the Organization. For each library you can view:
     • # of components: The total number of main components in that library.
     • # of Styles: The total number of styles in that library.
     • Used by: The number of teams using this library.
     • Inserts Last Week: The number of times a component from this library was inserted into a file. This is limited to the last week.
  7. Click on a library in the list to view its analytics.

  

  Tip! Figma updates Design System Analytics every hour.

  View detailed analytics for a library

  Click on a library to view more detailed analytics. Use the tabs at the top to switch between Overview and Library Analytics views.

  Before we jump in, let's cover a few terms you'll see in the analytics:

  • Component Insertions / Inserts: Any time someone adds an Instance of a component to a file. Figma records any of the following actions as insertions:
    • Copy an instance and paste it into the file
    • Duplicate a component instance within a file
    • Drag a component from the Assets panel into a file
      Nested components aren't included as insertions. Figma also ignores any components you create by duplicating an entire file.
  • Component Detaches / Detaches: Any time someone uses Detach Instance to break the connection between the instance and the main component. Learn more about detaching components →
  • Last Modified: The last time a collaborator modified the file. This includes any interaction with objects on the canvas, or leaving a comment.
  • [Last] Week: Refers to the a calendar week, not the "last 7 days". The end of the week will depend on your geographical location. e.g. North America considers Saturday the last day of the week vs Europe where Sunday is the last day of the week.

  If you're an Organization Admin, you can use the switch to toggle the library off and on for all files in the Organization. Learn more about shared libraries in an Organization →

  Overview

  1. View an overview of analytics for this library.
     • Teams using this library: The number of teams that have used Styles and components from this library.
     • Total Components: The total number of main components in that library
     • Total Styles: The total number of Styles in that library
     • Activity this week: The total number of times people have inserted components from this library in to files
  2. View all the Styles included in the library. This includes color, text, effect, and layout grid styles. Hover over the style to the view it's name.
  3. View All components in the library. Figma groups components by name, then file, page, and frame. Learn more about naming and organizing components → 

  

  Library Analytics

  Click on Library Analytics to view detailed analytics on how members are using components. Styles are not included in library analytics.

  Figma started tracking Library Analytics September 28th, 2019. Data before this date is not available. 

  1. Select the Duration you would like to view these analytics for. Choose from:
     • Last 30 Days
     • Last 60 Days
     • Last 90 Days
     • Last Year
       
  2. View a graph of Component Insertions. This shows the total insertions for this library, for the selected duration. Figma plots the graph to the end of the current week.
     • Current data is blue
     • Unavailable data is grey
     • Dashed line shows this week's current usage (incomplete)
     • Hover over the dot to view the date and total number of component insertions

     Tip! You can also compare performance between libraries. Learn how to compare analytics between libraries ↓

  3. View the teams that are using this library:
     • The top teams by # of insertions.
     • What percentage of total component insertions each team contributes
     • How many other teams are using this library
  4. Click the Download CSV link to download analytics for every team using this library.
  5. View Components Statistics for each component in the library. Both inserts and detaches are for the duration you set above.
     
     • Thumbnail of the component
     • Variants in the component set
     • Component name
     • Inserts
     • Detaches
  6. Click on the component in the list to see metrics for individual variants within that component set.

  

  Download a CSV of component usage to see which teams are using a particular library. The CSV download includes the following analytics:

  • Team ID: The unique ID Figma uses to identify the team.
  • Team Name: The name of the team as it appears in your Organization.
  • Insertions: The total number of component Insertions made in each team.
  • Insertion %: A team's percentage of total component insertions. Use this to see how teams contribute to component insertions.

  View variant and component usage

  Click on a component in the Components Analytics section to see how specific components are being used with component analytics.

  1. View information about the component set:
     • Description: The description for this component set.
     • Total: The total number of instances of any variants in this component set.
     • Used by: The number of teams that used any variants in this component set.
     • Used in: The number of files that have instances of this component set in them.
  2. View a list of variants included in that component set. You'll see some analytics for:
     • Instances (Total): How many instances of that variant exist.
     • Detaches (Last 30 Days): How many times someone has detached that variant from the component set in the last 30 days.
  3.  Click on a variant in the list to view analytics for that specific variant.

  

  Figma will show those same statistics, for that specific variant. You can also view a list of files that variant was used in for that reporting period. You'll only see files you have access to. 

  

  Note: Figma will only show files you have at least can view access to. This includes files from your Drafts, teams that you are a member of, and open teams.

  Compare libraries

  You can compare analytics between two libraries, which allows you to:

  • Track adoption of a new library (e.g. legacy vs new design system)
  • Compare how libraries are used across different operating systems
  • Measure work between products or brands

  From the Library tab of the Organization.

  1. Select one of the libraries you want to compare.
  2. Open the Library Analytics tab.
  3. Click the field next to Compare insertions to and select the second library from the list.
  4. Figma will plot the graph for both lLibraries
     • Data for the original library is in blue
     • Data for the second library is in black
     • Unavailable data is grey
     • Dashed line shows this week's current usage (incomplete)
  5. Hover over a dot to view the date and total number of component insertions.