Contact Us

If you still have questions or prefer to get help directly from an agent, please submit a request.
We’ll get back to you as soon as possible.

Please fill out the contact form below and we will reply as soon as possible.

  • Contact Us
  • Home
  • Figma Design – Figma Learn
  • Build design systems
  • Create and share libraries

Guide to libraries in Figma

Written by Figma Man

Updated at June 19th, 2025

Contact Us

If you still have questions or prefer to get help directly from an agent, please submit a request.
We’ll get back to you as soon as possible.

Please fill out the contact form below and we will reply as soon as possible.

  • Administration – Figma Learn
    Manage files and projects Manage a team Manage your account Manage a Figma organization Manage Enterprise plan settings and permissions Billing Manage Figma in a school
  • Figma Design – Figma Learn
    Create prototypes Import and export Create designs Tour the interface Dev Mode Work together in files Build design systems Figma Draw
  • Get started – Figma Learn
    Set up your account Layers 101
  • FigJam – Figma Learn
    Import and export Run meetings Work on boards Tour the interface
  • Community – Figma Learn
    Explore the Community Creator tools and resources
  • Help – Figma Learn
    Troubleshoot Common questions Work with support
  • Work across Figma – Figma Learn
    Figma AI Work across Figma
  • Courses, tutorials, projects – Figma Learn
    Courses Projects
  • Figma Slides – Figma Learn
    Create and edit slides Present slide decks Tour the interface Import and export
  • Figma Buzz – Figma Learn
    Templates in Figma Buzz Create and edit assets in Figma Buzz Overview
  • Figma Make – Figma Learn
    Tour the interface Work with Figma Make
  • Figma Sites – Figma Learn
    Design a site Create webpages and breakpoints Make your site interactive Preview and publish a site Tour the interface
+ More

Table of Contents

Example Create components, styles, or variables to use in a library Publish a library Choose which libraries to use in your files Use library assets in a file Accept updates to a library in your files Manage a library

Before you start

Who can use this feature

Available on all paid plans

In Figma, a library is a collection of design assets, like components, styles, and variables. These design assets live in a single file, but can be reused across different files or projects.

People often use libraries for sharing common design elements, like buttons, icons, pieces of UI, colors, or values for certain properties. This helps everyone stay consistent and makes it easy to build from existing designs.

When someone changes assets in a library, people can quickly review the changes and automatically update their designs.

Example

Here’s an example of how a design team working on the fictional app Habitz might use libraries in Figma:

  1. In a file, Kai creates components for different parts of the app, like the nav bar, menu, header, and other UI elements.
  2. They publish finalized components as a library from within the file.
  3. Working in a different file in the same project, Timothy views the library and adds a few components to the canvas.
  4. Some time later, Kai makes an update to one of the components in file where the library was published.
  5. In all other files that use the component, people working in the file get notified there's an update available to the component. People can review the component, and accept the update when they’re ready. The update gets applied to any instances of the component they’ve used.

Want to learn more about Kai and the Habitz team? You can follow their journey to launching a design system in Figma’s Introduction to design systems course →

Create components, styles, or variables to use in a library

The goal of a library is to share reusable design assets with other people you work with. These assets can be components, styles, or variables. Select a tab to learn more about each one.

Components are the building blocks of a design.

They can be individual elements, like icons or buttons, or a collection of elements, like menus and layouts.

When using libraries, the library file contains the main component, which defines the properties of the component for everyone to use.

When you access a library in your file, you can add an instance of the component to the canvas. This instance will receive any updates made to the main component.

Learn how to create components in your designs.

Styles define a collection of properties or settings we want to reuse. For example, you can use styles to:

  • Capture specific color values for fills and strokes
  • Define text properties like font, line height and letter spacing
  • Make presets for shadow and blur effects
  • Create shareable scaffolding in the form of rows, columns, and layout guides

Learn more about creating styles for colors, text, effects and layout guides.

Variables store reusable values you can apply to all kinds of design properties.

For example, you can:

  • Create design tokens for better efficiency when managing design systems
  • Switch a frame between different device sizes and see spacing immediately update according to a defined spatial system
  • Preview how different languages affect a design
  • Create a fully functional checkout cart design that calculates order total based on which items were added to the cart
  • Build a prototype of an interactive quiz that uses conditional logic to show whether a user answers a question correctly or incorrectly

Learn more about variables.

Publish a library

Before you can access components, styles, or variables in other files, you need to publish them as a library. You can choose which ones to publish, and on the Organization and Enterprise plans, who can have access to them.

If you change a published style, component, or variable, Figma will only apply the 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.

  • Publish styles, components, and variables to a library

Choose which libraries to use in your files

You can access published libraries in any draft files or team files where you have can edit access. Admins can set default libraries for a team or organization, which automatically enables them in every file.

  • Enable access to libraries in your drafts
  • Enable or disable a library in a design file

Don't have a library to use? Start building designs with UI kits instead.

Use library assets in a file

When you’ve found a library you want to use, you can add any components, styles, or variables to your file by following the instructions for each resource:

  • Create an instance of a component
  • Apply styles to layers and objects
  • Apply variables to designs

Accept updates to a library in your files

When someone publishes an update to a main component, style, or variable in a library, Figma makes the update available in every file where the component, style, or variable is used.

Anyone with can edit access to a file can review and accept or ignore the changes.

  • Accept updates from a library

Manage a library

People with can edit access to a library file can set permissions to the file, unpublish the library, and move assets between files.

  • Manage libraries in teams
  • Manage a library for a workspace or organization
  • Move published components between files
  • Unpublish a library

Was this article helpful?

Yes
No
Give feedback about this article

Related Articles

  • Publish a library
  • Edit main components
  • Hide styles, components, and variables when publishing
  • Unpublish a library
  • Move published components
  • Blog
  • Best practices
  • QR code generator
  • Color wheel
  • Colors
  • Color picker
  • Color palettes
  • Color palette generator
  • Color contrast checker
  • Font Library
  • Templates
  • Developers
  • Integrations
  • Affiliate program
  • Resource library
  • Reports and insights
  • Support
  • Status
  • Legal and privacy
  • Modern slavery statement
  • Climate disclosure statement
  • COMPARE
  • Sketch
  • Adobe XD
  • Framer
  • Miro
  • COMPANY
  • Events
  • Customers
  • Careers
  • Newsroom
Expand