Drommo
Componente · Headers

Header Creador Coral

Prompt

Crea un header listo para producción llamado «Creador Coral» usando React, TypeScript, Tailwind CSS, shadcn/ui e iconos Lucide. Usa una composición floating, color principal #f43f5e, secundario #fb923c y fondo #fff7ed. Implementa sticky con sombra al hacer scroll, logotipo, navegación principal, estado activo, CTA, buscador, estilos compatibles con temas, menú de usuario y navegación móvil. Los desplegables deben funcionar con teclado, Escape, gestión del foco, clic exterior, aria-expanded, aria-controls y landmarks nav semánticos. Evita interacciones disponibles solo mediante hover. Incluye estados para escritorio, tablet y móvil, reducción de movimiento, contraste WCAG AA, integración con rutas y datos de navegación tipados reutilizables. Devuelve el componente completo, dependencias y ejemplo de uso; no incluyas logotipos protegidos ni claves secretas.

Tipo
Componente · Headers
Tecnología
React, TypeScript, Tailwind CSS, shadcn/ui
  • Header
  • floating
  • Responsive
  • Navigation
  • SaaS
Crear en Drommo

«Crear en Drommo» abre un chat en el modo correcto con el prompt ya escrito. No se envía hasta que tú lo mandes.

Ideas parecidas