Artefactos de Claude: qué son, ejemplos y cómo compartir uno

Qué son los artefactos de Claude

El artículo de ayuda de Anthropic dice que Claude crea un artefacto cuando lo que escribe es:

• sustancial y completo en sí mismo, normalmente de más de 15 líneas;
• algo que probablemente vas a editar, rehacer o reutilizar fuera de la conversación;
• capaz de sostenerse solo, sin el resto del chat;
• algo a lo que probablemente vas a volver.

También puedes pedir uno, en cualquier chat o en Claude Code, o empezar desde una plantilla en la pestaña Artifacts (Artefactos), donde se guarda todo lo que haces. En la web y en Claude Desktop los creas, los editas y los compartes. En Claude para iOS y Android puedes pedir uno, verlo y editarlo, pero la configuración para compartir se cambia en la web o en la app de escritorio.

Los artefactos hechos en un chat antes del 16 de septiembre de 2026 son lo que Anthropic llama artefactos heredados (legacy artifacts). Siguen funcionando y todavía se pueden publicar y compartir, pero los nuevos ya no se hacen así. La diferencia pesa sobre todo al compartir, más abajo.

Los tipos de artefactos

Claude puede hacer uno de casi cualquier cosa, dice el artículo de ayuda: documentos, fragmentos de código, sitios web de una página, imágenes, diagramas y diagramas de flujo, paneles y pequeñas apps interactivas. Cinco plantillas les dan a los más comunes un punto de partida y un editor propio:

• Docs: documentos que escribes con Claude y con tu equipo, exportados a Word, PDF, Markdown o Google Docs.
• Slides: presentaciones que editas diapositiva por diapositiva y presentas en Claude, exportadas a PowerPoint o PDF.
• Design: maquetas, prototipos, one-pagers y landing pages, exportados como .zip, PDF, PowerPoint o HTML independiente.
• Dashboards (beta): gráficos de tus plataformas de datos o de apps conectadas, cada uno con la consulta que usa.
• Motion (beta): explicaciones animadas y recorridos, exportados como MP4, en Team y Enterprise.

Algunos artefactos llaman a Claude, y eso los convierte en pequeñas apps: un coach, un quiz, un juego. Las personas que usan uno inician sesión con su propia cuenta de Claude, y lo que preguntan cuenta en su propio plan, no en el tuyo. En Claude Code, un artefacto es una página HTML o Markdown, publicada en una dirección privada en claude.ai, que se actualiza a medida que avanza la sesión.

¿Se pueden usar los artefactos de Claude gratis?

Sí. Los artefactos están en Free igual que en Pro, Max, Team y Enterprise, y también las plantillas Docs, Slides y Design. Lo que Free no tiene, según las tablas de Anthropic:

• la plantilla Dashboards, desde Pro, y Motion, en Team y Enterprise;
• conectar tus apps a un artefacto, y guardar datos en uno, desde Pro;
• compartir un artefacto nuevo en un enlace, desde Pro. Free todavía puede publicar uno heredado en un enlace público.

En todos los planes necesitan activada la opción Cloud code execution and file creation (ejecución de código en la nube y creación de archivos), en Settings, Capabilities (Configuración, Capacidades), o en Organization settings en Team y Enterprise. En Claude Code, los artefactos están en Pro, Max, Team y Enterprise.

Ejemplos de artefactos de Claude

Las páginas de Anthropic dan los suyos: un diario o un registro que recuerda lo que anotas, un juego cuya tabla de puntuaciones comparten todos, y en Claude Code un recorrido por un pull request con el diff comentado, un panel con datos que trajo la sesión, o una línea de tiempo que se va llenando mientras corre una tarea.

Para abrir ejemplos que funcionan, la galería de plantillas de Solta tiene los tipos de páginas que la gente le pide a Claude. Cada una es un solo archivo React, en línea en su propio enlace, y puedes hacer un remix y cambiarla con tus palabras. Las páginas de las plantillas están en inglés:

• Plantilla de propuesta de proyecto: tres opciones con precio, extras y un cronograma que siguen la elección, con aprobación en pantalla.
• Plantilla de calculadora de ROI: controles deslizantes, plazo de recuperación, un gráfico a tres años y tres escenarios, con los números guardados en el enlace.
• Plantilla de panel SaaS: MRR por plan, altas, expansión y bajas, un puente de ingresos y una tabla de cuentas que se puede ordenar.
• Plantilla de cotización: partidas, descuentos, IVA y totales, impresos como una página A4 limpia o copiados como texto.
• Plantilla de itinerario de viaje: un itinerario por día, una lista de equipaje, un presupuesto dividido entre los viajeros y una cuenta regresiva.
• Plantilla de página web de boda con confirmación de asistencia: el día, el viaje, dónde alojarse y una confirmación de asistencia con opciones de cena que los invitados pueden cambiar.
• Plantilla de seguimiento de hábitos: rachas, una franja semanal y un mapa de calor de 16 semanas, guardados en el dispositivo e instalables como app.

Ve todas las plantillas. Un sitio en el plan Free de Solta lleva una pequeña marca Made with Solta, que lleva a cómo se hacen y se publican páginas como estas.

Cómo compartir un artefacto de Claude

Los artefactos empiezan siendo privados, solo tuyos. Para compartir uno, ábrelo y presiona Share (compartir), y elige quién tiene acceso: en Pro y Max, solo tú o cualquier persona que tenga el enlace, y puedes invitar a personas por correo (en beta). En Team y Enterprise, se quedan dentro de tu organización, a menos que un Owner (propietario) active el uso compartido externo.

Quién puede abrirlo es lo que hay que revisar. El artículo de Anthropic sobre compartir dice que todos necesitan una cuenta de Claude para abrir un artefacto compartido, incluso con el enlace, y que alguien a quien invitas por correo necesita una cuenta con esa dirección. La excepción es un artefacto heredado publicado desde un chat, en Free, Pro o Max: cualquiera con su enlace puede verlo y usarlo sin cuenta, y solo se le pide registrarse para las partes que usan Claude. Se puede insertar en otros sitios web que indiques, y retirar su publicación no se puede deshacer. La documentación de Claude Code dice que un artefacto que publica y que compartes públicamente se abre sin iniciar sesión.

Así que, antes de enviar uno, abre el enlace en una ventana privada del navegador, donde no tengas la sesión de Claude iniciada. Si se abre y funciona ahí, el enlace de Claude es todo lo que necesitas.

Cuándo ponerlo en Solta

Cuando la persona a quien va dirigido no tiene cuenta de Claude, o quieres decidir más sobre el enlace, publica el código mismo. Solta sirve un archivo HTML tal como es, y convierte un componente React en página cuando lo publicas, con React, Tailwind y los componentes de shadcn/ui que importa. Y entonces:

• Sin cuenta para abrirlo. Un enlace público o no listado se abre para cualquiera que lo tenga, en todos los planes, y los visitantes nunca pagan.
• Una contraseña, o personas con nombre. Contraseña en todos los planes (1 sitio a la vez en Free y 5 en Plus). Por invitación, en los planes Pro y Team, se abre solo para las direcciones de correo que agregues, cada una verificada una vez.
• Versiones. Un cambio es un borrador hasta que lo publicas, y cada versión publicada conserva su propia dirección. Free guarda las últimas 3; en los planes Pro y Team, se guardan todas.
• Comentarios. Cuando los activas (empiezan desactivados), cualquiera que pueda abrir un sitio público o no listado puede comentar en su página en Solta, dejando su correo, sin cuenta. La dirección propia del sitio sigue sin comentarios.
• Tu propio dominio. 1 dominio en Plus, 10 en Pro y todos los que necesites en Team. Cada sitio también tiene su propia dirección en solta.site.
• Insertar. Un sitio público o no listado se puede poner en tu web con un código corto; en el plan Free, lleva un pequeño sello de Solta.

Los pasos están en dos guías: alojar lo que hizo Claude en su propio enlace, con React incluido, y enviarlo a un cliente que no tiene cuenta de Claude. Una página que llama a Claude mientras la gente la usa tiene que llamar a un modelo a través de su propia dirección, en los planes Pro y Team: cómo un sitio llama a un modelo.

Pega tu página en la caja de arriba

Por qué un artefacto React se ve en blanco en otro lugar

El código copiado de Claude como archivo .jsx o .tsx es un componente React, no una página. Un navegador no puede ejecutar el JSX ni sus imports tal como están, y nada monta el componente, así que el archivo abierto solo no muestra nada. Las cinco causas, lo que muestra la consola en cada una, y la solución.

Publícalo desde el chat

Para no tener que copiar, agrega Solta a Claude como conector una vez. Luego pide, en cualquier chat, que publique lo que hizo Claude, y el enlace vuelve en la conversación.

En Claude: Customize → Connectors → Add custom connector (Personalizar → Conectores → Agregar conector personalizado), ponle el nombre “Solta” y, en URL, https://mcp.solta.now/mcp; luego inicia sesión en Solta, presiona Allow (permitir) y activa Solta en este chat.

También funciona en ChatGPT. Configura el conector.

Preguntas