aicoolies logo
Puck logo

Puck

Open-source visual editor for React — your components, drag-and-drop, no vendor CMS

Share
free
Visit Website →

Puck is an open-source visual page builder for React that gives marketing teams a drag-and-drop editor backed by your own components — no vendor CMS, no proprietary runtime, just your components rendered in a visual canvas. With 12,500+ stars, MIT license, and a small but active team at Measured Co., Puck has become the default self-hosted answer for React-native visual editing.

We have a review for this tool

A detailed review by the aicoolies team — click to read

Puck is an open-source visual page builder designed for React codebases that already have a component library and do not want a second vendor CMS bolted on top. Instead of shipping its own proprietary block system, Puck renders the exact React components the product already uses, so marketing teams can drag, drop, and configure pages in a visual editor while engineers keep full control of the code. The project crossed 12,500 GitHub stars under an MIT license in 2026 and is maintained by Measured Co., whose small team has kept the release cadence honest and the surface area tight.

The core of Puck is a JSON config that maps each editable component to a typed field schema. Fields can be strings, numbers, arrays, rich text, or custom React components, which means even complex layouts — image galleries, feature grids, pricing tables — render faithfully inside the editor and then export as a deterministic data blob the app can persist anywhere. There is no runtime lock-in: the output is plain JSON, the editor is a React component, and the dev team stays in charge of hosting, auth, and persistence. Plugins exist for Next.js, Remix, and headless CMS backends like Payload and Sanity, and the recent 0.18 line added iframe preview, responsive breakpoints, and undo/redo polish.

Puck fits the team that wants a visual editor inside its own application rather than a separate CMS. It shines in dashboards that need an admin-facing page builder, marketing sites where the marketing team should not file PRs to update a hero, and internal tools where non-developers compose forms and layouts. It does not try to be Builder.io or Contentful — there is no hosted service, no CDN, no A/B test engine, no content network. For teams that want those enterprise conveniences, Puck is not the answer. But for teams that value owning the stack end-to-end, having MIT-licensed code, and keeping the visual editor scoped to their own component library, Puck is among the cleanest options available in 2026.

Pricing

Fully open-source under MIT license. Self-host free; commercial support available from Measured Co. for enterprise deployments.

Platforms

React library, published on npm. Renders in any Next.js, Remix, or Vite app. Self-hosted in the user's stack — no hosted service.

Categories

Tags

Use Cases

Related Tools

OpenPencil

AI-native open-source design editor and Figma alternative

OpenPencil is an AI-native, open-source design editor for teams that want a Figma-like canvas with source-visible code and experimental AI design workflows. It is best framed as OpenPencil by the open-pencil project, separate from the same-name ZSeven-W repo, and useful for early UI prototyping, design-to-code exploration, and open-source visual editing pilots.

open-sourceOpen Source

Talk to Figma MCP

Read/write MCP bridge between AI coding agents and Figma

Talk to Figma MCP is an MIT-licensed bridge from Grab that connects Cursor, Claude Code, and other MCP-capable agents to Figma through a local MCP server, WebSocket bridge, and Figma plugin. Unlike read-only context servers, it can inspect selections, create or modify nodes, update text in bulk, and automate design operations, so teams should review permissions before enabling write access.

open-sourceOpen SourceTelemetry
Figma Context MCP logo

Figma Context MCP

MCP server that gives coding agents structured Figma context for design-to-code work

Figma Context MCP is an MCP server for giving coding agents structured access to Figma design context during implementation. Instead of copying screenshots or hand-written design specs into prompts, teams can expose layout, component, and context information to agents such as Cursor, Claude Code, and other MCP-compatible coding workflows. It is a strong design-to-code bridge for teams trying to reduce hallucinated UI details and tighten handoff between designers and AI-assisted developers.

open-sourceOpen SourceTelemetry
OpenHuman logo

OpenHuman

Local-first personal AI agent with memory trees, desktop integrations, and private workspace context.

OpenHuman is an open-source, local-first personal AI agent from TinyHumans. It combines a desktop app, persistent memory trees, Obsidian-compatible storage, OAuth integrations, and local model support into a private assistant harness. It is most interesting for users who want agentic workflows and long-term memory without handing every context detail to a fully cloud-hosted assistant.

open-sourceOpen SourceTelemetry
DenchClaw logo

DenchClaw

Local AI CRM and workflow automation on OpenClaw

DenchClaw is a local AI CRM and workflow automation app built on OpenClaw. It runs on a Mac at localhost, lets users chat with local business data, and focuses on lead enrichment, founder/customer research, and outreach automation. It belongs beside local AI, workflow automation, and OpenClaw-style personal-agent tools rather than pure coding IDEs.

open-sourceOpen Source
Re_gent logo

Re_gent

Version control for AI coding-agent actions

Re_gent is an open-source version-control layer for AI coding-agent activity. Instead of only reviewing the final Git diff, it records what the agent attempted, changed, and executed along the way so teams can trace, undo, and govern autonomous coding work. It fits Claude Code, Codex, Cursor, and multi-agent teams that need an audit trail between prompt and pull request.

open-sourceOpen Source

Comparisons