Third-Party Blocks

In addition to blocks we design from scratch, LayoutBlocks includes blocks ported from popular open-source component libraries. Each one has been fully adapted for Payload CMS with a proper block config, React component, preview variations, and documentation — just like any other block in the library.

Why Third-Party Blocks?

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 bridge that gap: we take great open-source designs and make them drop-in ready for Payload projects.

How They Work

Third-party blocks 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 use a short prefix to indicate their source:

For example, a hero block ported from Aceternity UI would be named ace-hero-1.

Where to Find Them

Third-party blocks appear in two places:

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

Attribution

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