LibreAI / Diseño / GrapesJS
// design · GrapesJS/grapesjs

GrapesJS

GrapesJS es un proyecto de diseño de código abierto de GrapesJS (GrapesJS/grapesjs en GitHub). Tiene 26.287 estrellas en GitHub y 4.650 bifurcaciones, se publica bajo la licencia Custom (check repo) y se actualizó por última vez en GitHub el 2 de octubre de 2026.

Free and Open source Web Builder Framework. Next generation tool for building templates without coding

★ 26,3k estrellas⑂ 4,7k bifurcacionesCustom (check repo)actualizado oct 2026
▦ visual: el README de este proyecto no incluye ninguna captura incrustable,
así que aquí va un marcador. La guía de abajo está completa de todos modos.
// datos del proyecto

Datos del proyecto

Estrellas en GitHub
26.287
Bifurcaciones
4.650
Licencia
Custom (check repo)
Última actualización en GitHub
2 de octubre de 2026
Categoría
Diseño
Tipo de ficha
Guía de instalación completa
Sitio oficial
Official site
// cómo funciona

Cómo funciona

  1. Choose your starting point

    A blank canvas, an existing screenshot, or a text prompt describing what you want.

  2. Design visually

    Drag, drop, and edit with real components — what you see is actual code underneath.

  3. Let AI assist

    Generate layouts from screenshots or prompts, then refine by hand where it matters.

  4. Export production code

    Ship clean React/Tailwind/CSS you can actually maintain, not a dead mockup.

// características

Por qué gusta tanto

Visual editing

Design directly on the canvas with real components and styles.

AI generation

Screenshot-to-code and prompt-to-UI that produce editable results.

Real code output

Exports are maintainable codebases, not locked-in proprietary files.

Collaboration

Multiplayer editing and commenting for teams.

Self-hostable

Your design files live on your infrastructure.

Open formats

No proprietary lock-in on your own work.

Advertisement
// ejecútalo

Ejecútalo tú mismo

  1. Step 1 — Clone the repo

    Download the source and move into the project folder.

    git clone https://github.com/GrapesJS/grapesjs.git
    cd grapesjs
  2. Step 2 — Install dependencies

    Use the package manager the project specifies (check for pnpm or yarn lockfiles).

    npm install
  3. Step 3 — Start it

    Launch the dev server or build, per the README.

    npm run dev
// casos de uso

Qué puedes crear

Advertisement
// preguntas frecuentes

Preguntas frecuentes

Can AI-generated UI be production quality?

As a starting point, yes — expect to refine by hand, which these tools are built for.

Figma replacement?

For many workflows, increasingly yes — especially teams wanting self-hosting or code output.

Who maintains GrapesJS?

It is an open-source project at GrapesJS/grapesjs with 4,650 forks. Check the repo's contributors and recent commits to see how active maintenance is.

What code does it export?

Typically React with Tailwind or plain HTML/CSS, depending on the tool.

Is it free?

The open-source tools here are free to use and self-host.

Do I need design skills?

AI-assisted starting points lower the bar a lot, but taste still helps.

// sigue explorando

Herramientas similares

Diseño

Onlook

The Developer Tool for Designers • An Open-Source AI-First Design tool • Visually build, style, and edit your code with AI • World's…

★ 26,9k estrellasApache-2.0
Ver la guía →
Diseño

Penpot

Penpot: The open-source design platform for Product teams that need scalable collaboration

★ 60,6k estrellasMPL-2.0
Ver la guía →
Diseño

Screenshot To Code

Drop in a screenshot and convert it to clean code (HTML/Tailwind/React/Vue)

★ 80,0k estrellasMIT
Ver la guía →
Diseño

paperbanana

PaperBanana — agentic generation of publication-quality academic figures, diagrams and plots from text

★ 2,4k estrellasMIT
Ver la guía →
Diseño

openchatbi

Chat with your data — natural-language BI with SQL generation

★ 658 estrellasMIT
Ver la guía →
Diseño

Smart-AI-Resume-Analyzer

AI resume analyzer — ATS-friendly templates and job-winning optimization

★ 256 estrellasMIT
Ver la guía →
// alternativas

Alternativas en Diseño

Los demás proyectos de Diseño con más estrellas del catálogo de LibreAI: la lista realista de alternativas si GrapesJS no es lo que buscas.

// más en design

Más en Diseño

Proyectos de Diseño cercanos en el catálogo, los más próximos en estrellas a GrapesJS: sigue explorando a ambos lados.

Consigue GrapesJS

Gratis y abierto: consigue el código fuente, dale una estrella al repositorio y empieza a crear.