메뉴
Generate premium HTML+Tailwind pages using Gemini 2.5 Pro, then publish via EasyBits. Use when asked to create landing pages, documentation, dashboards, email templates, or any web content.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | html-gen |
| description | Generate premium HTML+Tailwind pages using Gemini 2.5 Pro, then publish via EasyBits. Use when asked to create landing pages, documentation, dashboards, email templates, or any web content. |
| allowed-tools | Bash(generate-html:*), Read |
Generate pixel-perfect, premium HTML+TailwindCSS pages and publish them instantly.
# Basic landing page
generate-html "landing page for a Mexican taquería called El Bigotón, warm colors, food photos"
# With reference image (clone a design)
generate-html "replicate this design exactly" /workspace/group/attachments/img-1234.jpg
# Specific page types
generate-html "API documentation for a REST endpoint" --type doc
generate-html "monthly sales dashboard with charts" --type dashboard
generate-html "promotional email for Black Friday sale" --type email
# Read the generated file to verify quality
Use the Read tool on the generated HTML file. Check layout, content, and styling.
If the user wants changes, generate again with a more specific prompt — or edit the HTML file directly with small tweaks.
Use EasyBits MCP tools to publish the final HTML:
Option A — As a document (shareable link):
mcp__easybits__create_document({ title: "Landing Page", content: "<html>..." })
Option B — As a website page:
mcp__easybits__set_page_html({ website_id: "...", page_path: "/", html: "<html>..." })
Option C — Upload as file:
Read the HTML file content and use mcp__easybits__upload_file or mcp__easybits__deploy_website_file.
| Type | Flag | Best for |
|---|---|---|
landing | --type landing (default) | Marketing pages, product pages, sign-up pages |
doc | --type doc | Documentation, guides, FAQs, knowledge bases |
email | --type email | Newsletter, promotional, transactional emails |
dashboard | --type dashboard | Reports, analytics, admin panels |
Pages are generated with a default "Vibe Island" look: warm god-rays wallpaper (fixed full-page bg), grain noise overlay, JetBrains Mono typography, glass surfaces. The wallpaper is served from this repo via jsDelivr.
This default is soft — it applies only when the user does not specify a different aesthetic. If the user says "minimal", "corporate blue", a brand, or shares a reference image, the model follows that instead.
To explicitly bypass the default, just include the visual direction in your
prompt: generate-html "minimal white landing for X, no background imagery".
Redactar escritos jurídicos mexicanos largos (recursos de apelación, demandas, contestaciones, amparos) a partir de varios documentos de un expediente (demanda, contestación, pericial, confesional, sentencia), entregados como .docx editable. Úsalo cuando el usuario pida "recurso de apelación", "redacta el escrito", "haz la demanda/contestación en Word", o cualquier pieza procesal larga que deba correlacionar agravios/hechos con documentos fuente y jurisprudencia verificada.
Sintetizar o redactar un entregable a partir de varios documentos fuente (o pocos muy grandes) que juntos NO caben en la ventana de contexto — reportes multi-fuente, due diligence, análisis/comparación de contratos, resúmenes de expediente, investigación. Úsalo cuando debas correlacionar información entre múltiples documentos y producir un documento nuevo, y leerlos todos completos reventaría el contexto ("Prompt is too long"). NO es para leer un solo documento corto.
Busca y descarga assets de diseño (iconos, ilustraciones, 3D, animaciones Lottie, imágenes AI) desde IconScout. Dispara cuando el user pida un icono/ilustración/animación para un diseño, mockup, presentación o web, o mencione IconScout. 13.8M+ assets con licencia royalty-free.
Text-to-speech with Spanish voices (Kokoro, local & free) and OpenAI fallback
Transcribe a texto el HABLA de un audio largo o pesado (reuniones, notas de voz reenviadas, grabaciones de 10–60+ min). Trocea con ffmpeg y transcribe cada parte con Whisper, sin toparse con el límite de 25MB de la API. Úsala cuando llegue un [Audio file: ...] y el usuario pida "transcribe", "qué dice", "analiza el audio", o para resumir/analizar una grabación de voz.
Haz una versión nueva/ejecutiva/más limpia de un documento institucional (PDFs tipo "orden del día", agendas, hojas de evento, programas) MINANDO sus assets reales (logos, fotos de ponentes, texto, fuentes) y RECONSTRUYENDO en HTML — nunca re-difundiendo la página como imagen. Úsala ante "haz una nueva versión", "versión ejecutiva", "rehazlo más limpio", "adáptalo" de un PDF.