Sobre el proyecto

## Qué es design-md-hub es un repositorio de código abierto con 120 sistemas de diseño de marcas, cada uno capturado como un único archivo `DESIGN.md` en texto plano que los agentes de codificación por IA pueden leer. Cada especificación fue ingeniería inversa desde el sitio web en producción de la marca, por lo que las tipografías, valores hexadecimales, logotipos y textos provienen de la fuente real en lugar de ser adivinados. Los valores que no pueden confirmarse desde el sitio en vivo se omiten. ## Qué contiene un DESIGN.md - Paletas de colores y tokens semánticos - Escala tipográfica y selección de fuentes - Patrones de componentes y variantes - Espaciado, sombras y radio de borde - Principios de diseño y comportamiento responsivo - Tono, directrices y hacer/no hacer Cada carpeta de marca también incluye un `preview.html` autocontenido que se abre directamente en el navegador sin paso de compilación, permitiendo inspeccionar la identidad visual. ## Flujo de trabajo descrito en el README 1. Se obtiene el sitio en vivo de la marca (HTML, CSS, fuentes) y se extraen los tokens reales. 2. Esos tokens se convierten en una especificación `DESIGN.md` en texto plano. 3. Un `preview.html` correspondiente demuestra la identidad en el navegador. 4. Un agente de codificación lee el `DESIGN.md` para generar UI con la voz de esa marca. ## Cobertura La colección abarca herramientas para desarrolladores, productos de IA/LLM, herramientas de diseño, fintech, análisis, observabilidad, aplicaciones de productividad, servicios de autenticación, plataformas de datos, comercio y automatización. Entre los ejemplos con nombre se encuentran GitHub, Figma, Cursor, Linear, Stripe, Vercel, Supabase, Notion, Docker, MongoDB, Cloudflare, OpenAI, Claude, Mistral AI, ElevenLabs, Tailwind CSS, shadcn/ui, n8n, Zapier, Grafana y muchos más. Un sitio galería en vivo está vinculado desde el README para explorar las vistas previas. ## Cómo usarlo 1. Selecciona un `DESIGN.md` de la colección listada. 2. Copia el archivo en la raíz de tu proyecto. 3. Indícale a tu agente de codificación que siga el DESIGN.md en la raíz del proyecto. 4. Genera componentes, páginas o aplicaciones completas con estilos consistentes. No hay muros de pago, registros ni claves API requeridos; se aceptan contribuciones a través del CONTRIBUTING.md del repositorio. ## Notas El README indica que estas especificaciones son referencias no oficiales creadas con fines educativos y de prototipado, ingeniería inversa desde sitios de marca públicos, y no están avaladas ni afiliadas a las marcas. Las marcas registradas y logotipos permanecen con sus propietarios. El proyecto tiene licencia MIT.