All videos
Shared Libraries
Trouble with this video? YouTube may be blocking it for you. Watch it directly on YouTube instead.

Shared Libraries

Shared Libraries in Webflow let you share components, variables, tag styles, assets, fonts, and Agent Instructions across sites in your Workspace. They help your team maintain consistent branding and give AI agents shared guidance as your design system grows.

In this video lesson, learn how to share a Library from a source site, install it on another site, and work with local overrides. You’ll also see how to share and accept updates, handle conflicts, manage Libraries from the Workspace dashboard, and understand what happens when you uninstall or unshare a Library.

Video transcript

With Shared Libraries in Webflow, you can share and use components, variables, tag styles, assets, fonts, and agent instructions from one site...across an entire Workspace.

And the best part? Updates to the source can also be pushed across the Workspace, so everything stays in sync.

This is super useful when you've got multiple sites for one company and want to maintain brand consistency across those sites, and, increasingly, consistency in how AI agents work across those sites too.

We're going to cover Shared Libraries in five parts: Sharing a library, Installing and using a library on a new site, Pushing and accepting updates… Including handling any conflicts. Managing libraries from the Workspace dashboard. And lastly,... Uninstalling & unsharing a library.

Let’s start with sharing a library.

Here's a Webflow site... Wrong tab.

Here’s a Webflow site with components built to fit a company's brand, all using variables. A good practice to know: keep one site as your design system, the source of truth for components, variables, tag styles, assets, fonts, and even the agent instructions your team wants AI tools to follow. That’s exactly what this is. (This site is just for internal use only.)

To share it, open the Libraries panel in the left toolbar, or just press L. Expand Site resources, and click "Share with Workspace."

This opens the Share Library modal. You can add an optional description of what you're sharing, and you'll see a breakdown of what's included: components, variables, tag styles, fonts, skills & rules, and assets. Heads up: a component with a Collection list inside, like a blog feed, can't be shared, so it won't be included here.

Click "Asset settings" if you want to choose exactly which asset folders get shared. Then click "Share library."

Done. Library shared, it's now available to install on any site in the Workspace, even for teammates who don't have access to this source site.

That’s sharing a library, now let’s look at installing a library.

Here I am in a blank site, and I need to build it using the same components, variables, and assets to match the company's brand.

Same panel, Libraries, and this time it’ll be under "Available to install." (In some cases, you might have to click to expand) Hover over the library, and click the install icon.

Once it installs, we get everything: all the components, variables, and assets from the source site, plus its fonts. Those show up automatically in the Typography section, no separate setup needed. And check out this heading. It already matches the one on the source site, and we didn't style a thing. And we can see it’s inheriting the font styles by the little book icon. That's the tag styles at work: the default styles for headings, paragraphs, and body text. If this site already had its own, Webflow would ask whether we want the library's or want to keep ours.

Now we can just use them to build and style our site. We can even customize a component instance using component properties.

One thing you'll notice: we can't edit the main components, variables, tag styles, or fonts directly, those stay locked to the source site. If we want a heading to look different on this site, we can change it right here, and our version wins. Reset it, and it goes right back to the library's. And this site keeps all of its own site components alongside the Library's. They live side by side in the Components panel.

One thing to keep in mind: a site can install shared Libraries or share its own Library with the Workspace, but it can't do both. You can install more than one library on the same site, though, if you need to. If more than one has tag styles, we can switch each one on or off, and drag them into the order we want.

Now... let’s look at updating our library and resolving any conflicts.

Back in our source site, we can make changes to elements or components. And those changes will be reflected on sites where the library is installed.

To push these, go back to the Libraries panel, Site resources, and click "Review updates." You'll see a changelog of what changed, from here we can click Share, and then, we’ll be prompted to select sites we want to push update to. We can select all of them, or, each one individually. We also have the option to review changes before pushing the updates. Now let’s update, and, again, confirm our update.

If your team keeps shared agent instructions in this Library, they get pushed the same way. So an agent connected through Webflow MCP follows the same up-to-date guidance on every site, like class naming conventions or brand voice, instead of whatever was set up when that site was first built.

Those updates are now available Workspace-wide. On an Enterprise Workspace plan, we can push them to multiple sites at once from the source site's installation list, as long as we have permission to edit those sites. Otherwise, each site reviews and accepts the updates individually. And either way, each site still needs to be published before visitors see the changes.

Over on our other site: a blue dot on the Libraries icon tells us updates are waiting. Open the panel, expand Installed Libraries, click "Review changes," review the changelog, and click "Accept all updates." Then publish.

Just like that, the library's updated, and every instance of that navbar component picks up the change, including the new property we can now customize.

So what happens when an update would remove something you're actively using?

Let’s delete a property from one of our components. We’ll head over to our libraries panel, click on share updates, and click share again. But this time, we won’t share will all sites. Let’s go back over to our site that uses the shared library, click to review changes, and... since we're using that property, we now get a choice: accept the update, or convert to a site component.

Accepting updates all instances to match the library. Converting keeps your version as a site component, but disconnects it from the library going forward, so future library updates won't reach it.

If an entire shared component, variable, or asset is deleted, it just converts to a site version when we accept the update.

And any time you want, you can right-click a library component and convert it to a site component, whether or not there's an update. For assets, hover over one in the Assets panel and choose Duplicate to get your own local copy.

Next, let’s take a look at our Library Workspace.

So far we've been managing everything from inside individual sites. But if you're running several Libraries, or a Library installed across a lot of sites, there's a central place to see it all: Navigate to your dashboard, head over to libraries and templates, and click shared.

From here, you get every shared Library in the Workspace in one list: how many sites have it installed, and how many of those installs have updates waiting to be reviewed.

Click into a Library's installation count to see exactly which sites are using it, and jump straight into any of them. You can also open a Library's source site or its Site settings directly from this menu, handy when you don't remember which site a given design system actually lives on.

This is also where you'll unshare a Library Workspace-wide, which we'll get to shortly. And on an Enterprise Workspace plan, Workspace owners and admins can turn on Auto-install so new sites start with this Library already installed.

But that’s the Library Workspace. Lastly, let’s take a look at unsharing and uninstalling a library.

In the Libraries panel, expand Installed Libraries, hover over the library, click the "more options" dots, and choose "Uninstall library." Confirm.

Nothing's lost. Any library components, variables, tag styles, or assets in use on your site convert automatically to site versions, so you keep building without interruption. Fonts are the one exception. If we check our font settings, the library's fonts are still listed, even after uninstalling. We can remove them from here if we don't need them.

Last part, unsharing, and it's quick.

Back in the source site, open the Libraries panel, Site resources, hover over the library, click the "more options" dots, and choose "Unshare library." Confirm.

Now the library can't be installed on any new sites in the Workspace. But sites that already have it installed keep working exactly as before, until they choose to uninstall.

You can also do this straight from that Workspace dashboard we just looked at: Libraries & Templates > Shared.

And that's it. We covered sharing a library, installing and using a library on a new site, pushing and accepting updates, managing libraries from the Workspace dashboard, and, uninstalling & unsharing libraries.

There's a lot more to Libraries, like Marketplace Libraries, built by designers and developers in the community, and Agent Instructions, which help keep AI tools working consistently across every site on your design system, and you can learn more about those and design system best practices over at Webflow University.

But that's Shared Libraries in Webflow.