Skip to content
Docs
Download

Component library

The Component library is a curated catalog of reusable blocks and patterns. The same list appears on web.ssscript.app and in the Webflow extension, so what you see in the app matches the web showcase.

Opening the library

Section titled “Opening the library”

With a project open, open the Command palette (⌘⇧P / Ctrl+Shift+P) and run Open component library. It opens as a full-screen view over your workspace; use ← Back to return.

The library requires a project to be open. Plain ⌘P opens Quick Open (file finder), not the command palette.

Browsing

Section titled “Browsing”
  • Search — filter by title or tags with the search box.
  • Tag filters — click tag pills to narrow the list (matching any selected tag). Use Clear tags to reset.
  • Preview — each card shows a preview and its tags. The arrow on a card opens the marketing showcase for that component in your browser.

Using a component

Section titled “Using a component”

Each card has a Copy action that copies the component’s Webflow JavaScript to your clipboard. Paste it into your project’s module (under src/modules/) and wire it to the matching Webflow markup with data-module and data-* hooks — see the Module system.

The desktop library copies code for you to paste; it does not insert files into your project or push markup to Webflow directly. For agent-driven creation across code and the Designer, use AI edits with Webflow connected.

Where the catalog comes from

Section titled “Where the catalog comes from”

The catalog is bundled with the app (from the @repo/component-catalog package), so browsing and search work offline. New components ship with app updates.

Section titled “Related”