Libraries

Organize UI components and design tokens with Alloy libraries. Keep prototypes consistent and on-brand. Build better design systems today.

Introduction to Libraries

Alloy supports your branding and design system, making every design follow your guidelines automatically.

Libraries let you store, organize, and reuse these components across multiple projects, keeping prototypes consistent and on-brand.

  • Components: The reusable building blocks of your designs (e.g., buttons, icons, forms). Components are automatically captured when you capture a page and stored within libraries.
  • Design tokens: Fonts and colors from your original page. These are also automatically captured and stored within libraries.

Creating a library

A library is a collection of reusable components. Components that are often used together should be grouped in the same library.

Libraries are created automatically when you capture the first page from your site.

Using your library

To make a library the default source for components in new designs, use the Library picker in the prompt box. Any design generated with that preset will automatically use components from the linked library whenever possible.

When you update a design, Alloy continues to pull from the same library to maintain visual and functional consistency across your prototypes.

Best practices for using libraries

  • Use clear, descriptive names so team members can quickly find the right library (e.g., “Mobile App UI – Light Theme” instead of “UI v2”).
  • Group related components together — keep all variations of a component (buttons, form fields, navigation bars) in the same library for consistency.
  • Match your design system structure so Alloy libraries align with your existing Figma, Sketch, or code component hierarchy.
  • Version your libraries when making major updates — create a new library version for significant design changes to avoid breaking existing prototypes.
  • Audit libraries regularly to remove outdated components and ensure all assets reflect the latest branding and design standards.
  • Document component usage inside the library or in a shared guide so anyone can understand when and how to use each asset.