getdesign

¿Qué es getdesign?

getdesign extrae un sistema de diseño de un sitio web público. Abre el sitio en un navegador real, lee el CSS del sitio y captura la página renderizada; después escribe sus colores, tipografía, espaciado y componentes en un archivo design.md basado en el CSS real del sitio. El resultado puede leerse como una guía de estilo o entregarse a un agente de programación como contexto al construir una interfaz.

La herramienta está disponible en cinco superficies que comparten un mismo núcleo de agente, más una Skill que se ejecuta dentro de un agente de programación. Actualmente está en beta, y las ejecuciones alojadas dependen de tus propias claves de proveedor en lugar de una clave de API de getdesign.

¿Cómo usar getdesign?

Panel web

Inicia sesión en el panel, guarda tus claves de Daytona y OpenAI en Cuenta y luego pega la URL de un sitio web público en Agente para generar un design.md. También puedes explorar ejemplos en caché sin ejecutar proveedores.

API

GET /v1/design en api.getdesign.app devuelve Markdown o JSON. Se requieren autenticación bearer de WorkOS y claves de proveedor.

CLI

Ejecuta bunx @getdesign/cli en Bun con tus claves de Daytona y OpenAI. Escribe design.md en un archivo local.

SDK

Instala @getdesign/sdk con bun add @getdesign/sdk para ejecutar el agente en proceso sobre Bun, con resultados tipados y eventos de progreso, usando tus claves de proveedor.

Skill

Añade el SKILL.md portátil con skills add MohtashamMurshid/getdesign. Se ejecuta dentro de Claude Code, Codex o Cursor, usando las propias herramientas del agente.

Funciones principales de getdesign

Extracción del sistema de diseño

getdesign lee los tokens CSS de un sitio público, captura la página en un navegador y produce un documento de diseño que abarca colores, tipografía, espaciado y componentes.

Salida design.md

Los resultados se entregan como un documento Markdown que describe el sistema de diseño del sitio web. Las ejecuciones visuales también incluyen capturas de pantalla.

Múltiples superficies de acceso

Web, API, CLI y SDK de TypeScript acceden al mismo núcleo de agente; la Skill se ejecuta dentro de tu propio agente de programación. La CLI y el SDK se ejecutan localmente en Bun, mientras que la API HTTP admite ejecuciones alojadas.

Ejecuciones privadas con publicación opcional

Las ejecuciones del panel permanecen privadas hasta que las publiques. Publicar crea un enlace que cualquiera puede usar para ver y descargar el documento de diseño y las capturas de pantalla; puedes volver a hacer privada una ejecución para cerrar el acceso futuro, aunque las copias ya descargadas permanecen con sus destinatarios.

Casos de uso de getdesign

Producir una guía de estilo a partir de un sitio en vivo

Genera un documento de diseño legible desde un sitio web público que describe sus colores, tipografía, espaciado y componentes.

Dar contexto de diseño a un agente de programación

Pasa el design.md generado y sus capturas de pantalla a un agente de programación, o instala la Skill para que el agente extraiga el contexto de diseño con sus propias herramientas.

Ejecutar la extracción en un flujo de trabajo local o alojado

Usa la CLI o el SDK de TypeScript para ejecuciones locales en Bun, o la API HTTP para ejecuciones alojadas que devuelven Markdown o JSON.

Compartir un documento de diseño

Publica una ejecución del panel para crear un enlace que otros puedan usar para ver y descargar el documento de diseño y las capturas de pantalla.

Preguntas frecuentes sobre getdesign

¿Qué es un archivo design.md?

Un design.md es un documento Markdown que describe el sistema de diseño de un sitio web. Puedes leerlo como una guía de estilo o dárselo a un agente de programación como contexto al construir una interfaz. Las ejecuciones visuales también incluyen capturas de pantalla.

¿Cómo extraigo los colores y las fuentes de un sitio web?

Guarda tus claves de Daytona y OpenAI en Cuenta y luego pega la URL de un sitio web público en Agente. getdesign lee los tokens CSS, captura la página en un navegador y genera un documento de diseño que puedes descargar. También puedes explorar ejemplos en caché sin ejecutar proveedores.

¿Puedo usar getdesign con un agente de programación?

Sí. Dale a tu agente de programación el design.md generado y sus capturas de pantalla, o instala la Skill de getdesign para extraer el contexto de diseño usando las propias herramientas del agente. La CLI y el SDK de TypeScript también se ejecutan localmente en Bun, y la API HTTP admite ejecuciones alojadas.

¿Hay autenticación o un plan de pago?

El panel usa el inicio de sesión de WorkOS. Las ejecuciones alojadas requieren tus propias claves de Daytona y OpenAI; no hay una clave de API de getdesign en V1. V1 no tiene facturación de ejecuciones de getdesign. Pagas a Daytona por la captura del navegador y a OpenAI por el uso del modelo.

¿Mis ejecuciones de diseño son públicas?

Las ejecuciones de tu panel son privadas hasta que las publiques. Publicar crea un enlace que cualquiera puede usar para ver y descargar el documento de diseño y las capturas de pantalla. Puedes volver a hacer privada una ejecución para cerrar el acceso futuro; las copias ya descargadas permanecen con sus destinatarios.