¿Qué hace OpenBrand?
Extrae activos de marca de cualquier URL de sitio web: logotipos, colores, imágenes de fondo y nombre de marca.
Configuración
Servidor MCP (recomendado para Claude Code / Cursor)
claude mcp add --transport stdio \
--env OPENBRAND_API_KEY=tu_clave_api \
openbrand -- npx -y openbrand-mcp
Obtén tu clave API gratuita en openbrand.sh/dashboard.
Una vez configurado, usa la herramienta extract_brand_assets con una URL para obtener datos estructurados de la marca.
Paquete npm (no necesita clave API)
npm add openbrand
import { extractBrandAssets } from "openbrand";
const result = await extractBrandAssets("https://stripe.com");
if (result.ok) {
// result.data.brand_name → "Stripe"
// result.data.logos → LogoAsset[]
// result.data.colors → ColorAsset[]
// result.data.backdrop_images → BackdropAsset[]
}
API
curl "https://openbrand.sh/api/extract?url=https://stripe.com" \
-H "Authorization: Bearer tu_clave_api"
Qué extrae
| Activo | Fuentes |
|---|---|
| Logotipos | Favicons, apple-touch-icons, logotipos en encabezados/nav, SVGs en línea (con análisis de dimensiones) |
| Colores de marca | Metaetiquetas theme-color, manifest.json, colores dominantes de imágenes de logotipos |
| Imágenes de fondo | og:image, fondos CSS, imágenes de héroe/banner |
| Nombre de marca | og:site_name, application-name, texto alternativo del logotipo, título de la página |
Formato de respuesta
{
"brandName": "Stripe",
"logos": [
{ "url": "https://...", "type": "favicon", "resolution": { "width": 32, "height": 32, "aspect_ratio": 1 } }
],
"colors": [
{ "hex": "#635bff", "usage": "primary" },
{ "hex": "#0a2540", "usage": "secondary" }
],
"backdrops": [
{ "url": "https://...", "description": "Imagen de héroe" }
]
}
Cuándo usar esta habilidad
- Al crear una página de inicio o interfaz que coincida con la marca de un cliente
- Generar guías de estilo o tokens de diseño de marca
- Crear plantillas de correo electrónico o materiales de marketing con la marca
- Poblar campos de marca en un CMS o herramienta de diseño
- Cualquier tarea donde necesites logotipos, colores o imágenes de un sitio web