Third-Party Blocks

In addition to blocks designed from scratch, LayoutBlocks will include blocks ported from popular open-source component libraries. Each one will be fully adapted for Payload CMS with a proper block config, React component, preview variations, and documentation — just like any native block in the library.

Third-party blocks are not available yet. This page describes how they will work when they arrive.

The Idea

The frontend ecosystem has incredible free components from libraries like Aceternity UI and Magic UI. But none of them come with Payload CMS configs. Third-party blocks will bridge that gap: taking great open-source designs and making them drop-in ready for Payload projects.

How They Will Work

Third-party blocks will work exactly like native LayoutBlocks. You copy the config.ts and component.tsx into your project, register them, and you are done. The only difference is that each block credits its original source.

Naming Convention

Third-party blocks will use a short prefix to indicate their source:

For example, a hero block ported from Aceternity UI would be named ace-hero-1. The prefix keeps the origin clear at a glance and prevents slug collisions with native blocks.

Where They Will Appear

Once available, third-party blocks will appear in two places:

• Within their category — alongside native blocks in the sidebar (e.g., under "Heros")
• In a Third-Party Blocks section — grouped by source library for easy browsing

Attribution

Every third-party block page will include a banner crediting the original source with a link to the original component. We respect open-source licenses and always link back.