Lee el archivo README.md dentro de esta skill y explora los otros archivos disponibles.
Si estás creando artefactos visuales (diapositivas, maquetas, prototipos desechables, etc.), copia los activos y crea archivos HTML estáticos para que el usuario los vea. Si estás trabajando en código de producción, puedes copiar los activos y leer las reglas aquí para convertirte en un experto en diseño con esta marca.
Si el usuario invoca esta skill sin ninguna otra guía, pregúntale qué quiere construir o diseñar, haz algunas preguntas y actúa como un diseñador experto que genera artefactos HTML o código de producción, según la necesidad.
Inicio rápido
- Acento primario: Índigo
#3F51B5(portafolio). Gradiente azul más frío#2980b9 → #1a6da3solo para la barra de navegación fija del blog. - Tipografía: Poppins (display/cuerpo, pesos 300/400/500/600/700) + Roboto Mono (cejas, meta, código en línea).
- Cejas de sección: minúsculas + mono + subrayadas con un lavado índigo al 40% de opacidad. Los títulos de servicios están en MAYÚSCULAS con espaciado entre letras de 2px.
- Voz: primera persona, segura, marcos nombrados (SOC 2, zero trust, DevSecOps). Evita el lenguaje de marketing genérico.
- Emoji: solo ☀️ / 🌙 para el modo oscuro. No introduzcas más.
- Logos:
assets/laplante-logo.png(sobre fondo claro) +assets/laplante-logo-white.png(sobre fondo oscuro). - Tokens: importa
colors_and_type.css— todos los tokens viven allí como variables CSS--lp-*.
Archivos
colors_and_type.css— tokens de diseño + clases de tipo semánticoassets/— imágenes raster del logotipopreview/— muestras de color + especímenes (usados por la pestaña del Sistema de Diseño)ui_kits/portfolio/— página de inicio + servicios + cronograma + contacto (alta fidelidad)ui_kits/blog/— listado del blog + lector de artículos (alta fidelidad)