Templates

Publino: La plantilla Next.js definitiva para startups modernas

Descubre Publino, una plantilla Next.js de alto rendimiento y optimizada para SEO, diseñada para SaaS, startups y agencias. Crea y lanza sitios web impresionantes en minutos.

Por Aniq-UIActualizado el 30 de octubre de 202611 min de lectura
Compartir:
Publino: La plantilla Next.js definitiva para startups modernas
#Next.js#Template#Landing Page#SaaS#Startup#React#Web Design

En resumen: Publino es una plantilla de pago de Aniq-UI en Next.js 16, pensada como landing page para un producto por suscripción o un negocio que vende planes. Incluye tres páginas (inicio, precios con planes mensuales y anuales, y contacto) en inglés y árabe, con la versión árabe de derecha a izquierda, temas oscuro y claro, y sin base de datos ni back end que configurar. La ejecutas con Docker o con Node.js y Yarn, reemplazas el contenido de ejemplo y la publicas en Vercel, en un servidor Node.js o en cualquier host que ejecute Docker.

¿Buscas una plantilla de landing page moderna y de alta conversión construida con Next.js 16? Conoce Publino: la solución todo en uno para SaaS, startups, agencias y creadores que quieren lanzar rápido y verse profesionales.


🖼️ Vista previa en vivo

Mira Publino en acción:

  1. 🔗 Demo en vivo
  2. 🛒 Comprar Publino

🚀 ¿Por qué Publino?

Publino es más que una plantilla. Es un kit de UI y sistema de landing page completo, creado para velocidad, SEO, accesibilidad y conversión. Ya sea que lances un nuevo producto, valides una idea o actualices el sitio de tu agencia, Publino te da ventaja.

Características principales

  1. Next.js 16 & React 19: Construido con la última tecnología para un rendimiento ultrarrápido.
  2. Optimizado para SEO: HTML semántico, Open Graph, Twitter cards y datos estructurados incluidos.
  3. Modo oscuro: Hermosos temas claro y oscuro con un solo clic.
  4. Diseño responsive: Se ve perfecto en móvil, tablet y escritorio.
  5. Componentes premium: Hero, precios, FAQ, contacto y más.
  6. Despliegue en un clic: Sube a Vercel o tu plataforma favorita en segundos.
  7. Fácil personalización: Cambia colores, fuentes y secciones fácilmente.
  8. Actualizaciones de por vida: Mejoras continuas y nuevas funciones.

🔥 ¿Qué hace diferente a Publino?

  1. Enfocado en la conversión: Cada sección está diseñada para captar registros y ventas.
  2. Rendimiento primero: páginas ligeras, pensadas para cargar rápido, sin excesos.
  3. Amigable para desarrolladores: TypeScript, Tailwind CSS 4 y código limpio y documentado.
  4. Listo para producción: Incluye licencias y secciones de contacto.
  5. Listo para internacionalización: Añade fácilmente varios idiomas con next-intl.

🛠️ ¿Qué incluye Publino?

Publino viene con todo lo que necesitas:

  1. Landing page: Hero, características, beneficios, precios, FAQ, contacto.
  2. Componentes UI: Botones, modales, tarjetas, pestañas y más.
  3. Listo para blog: Añade fácilmente un blog para mejorar tu SEO.
  4. Formulario de contacto: Integrado y listo para conectar a tu backend o servicio.
  5. SEO & Analytics: Meta tags, datos estructurados e integración fácil de analytics.

💡 ¿Para quién es Publino?

  1. Fundadores SaaS: Lanza tu MVP o sitio de producto en horas, no semanas.
  2. Agencias: Entrega sitios impresionantes a tus clientes fácilmente.
  3. Indie Hackers: Valida ideas y haz crecer tu audiencia rápido.
  4. Marketers: Ejecuta landing pages para campañas y generación de leads.

🛒 Consigue Publino hoy

¿Listo para lanzar tu próximo proyecto? Compra Publino ahora y obtén acceso instantáneo, actualizaciones de por vida y soporte premium.

📦 Cómo usar Publino

  1. Descarga la plantilla (.zip).
  2. Instala las dependencias:
yarn install
  1. Inicia el servidor de desarrollo:
yarn dev
  1. Personaliza tu contenido, colores y branding.
  2. Despliega en Vercel, Netlify o tu host favorito.

📈 Mejora tu SEO y tráfico

Publino está construido con las mejores prácticas SEO. Añade tu blog, optimiza tu contenido y sube en los rankings de búsqueda. Además, con tiempos de carga rápidos y optimización móvil, tus visitantes (y Google) amarán tu sitio.

🙋‍♂️ ¿Necesitas ayuda?

Consulta la documentación.


¿Listo para crear tu próximo gran proyecto? ¡Consigue Publino ahora y lánzate con confianza!


Referencias:

  1. Documentación Next.js
  2. Top plantillas Nextjs
  3. Internacionalización next-intl

Descubre la demo de la plantilla de landing page Next.js (edición 2026) o explora más plantillas de landing page Next.js en Aniq-UI.

Qué trae la descarga, en detalle

Las tres páginas

PáginaDirecciónQué muestra
Inicio/La landing page, sección por sección (tabla siguiente)
Precios/pricingTres planes con un interruptor Monthly y Annual, una tabla comparativa de 21 características y seis preguntas
Contacto/contactUn formulario de contacto, los datos de la empresa, enlaces sociales y tres preguntas

Cada página existe también en árabe bajo /ar, con el diseño de derecha a izquierda. Publino no tiene página de blog: si tu sitio la necesita, la añades tú.

La página de inicio, sección por sección

SecciónQué muestra
HeroUn titular que aparece palabra por palabra, una frase y dos botones
Maqueta del panelUn panel de despliegues inclinado en 3D, construido en código, con tarjetas de cifras que puedes arrastrar
Por qué elegirnosCuatro tarjetas con una luz que sigue al puntero
CaracterísticasCinco tarjetas animadas, entre ellas puntuaciones de rendimiento y un globo 3D
PlantillasCuatro tarjetas de plantillas con imagen, insignia y precio
ResponsiveUn sitio mostrado en un ordenador, una tableta y un teléfono
PreciosLos tres planes mensuales con un filtro por categoría de características
Preguntas frecuentesDiez preguntas con categorías y búsqueda
Comunidad globalUn mapa del mundo con un formulario de mensaje encima

La maqueta y las tarjetas de características son ilustraciones: sus puntuaciones, ciudades y cifras son datos de ejemplo fijos. El sitio se abre en el tema oscuro, un botón de sol y luna cambia al claro y el navegador recuerda la elección.

Stack tecnológico

Next.js 16 con el App Router, React 19 y TypeScript, Tailwind CSS 4, next-intl para inglés y árabe, React Hook Form con Zod para los dos formularios, Motion para las animaciones, Recharts, dnd-kit y cobe para el gráfico, las tarjetas que se arrastran y el globo, y Radix UI con Tabler Icons. Cada dependencia está fijada a una versión exacta y yarn.lock viene con la descarga, así que tu instalación coincide con la que se usó para probar la plantilla.

Paquete y licencia

Publino se vende en un solo paquete, Landing page: la landing page completa, con un diseño responsive, modo oscuro, páginas listas para SEO y carga rápida. El precio actual está en la página de la plantilla Publino, y Publino es también una de las diez plantillas del pack de plantillas Next.js.

La licencia es comercial: puedes usarla en tantos proyectos como quieras, propios o de clientes, modificar el código y entregar sitios terminados a tus clientes. No puedes revender ni compartir públicamente el código fuente, incluirlo en un proyecto de código abierto ni venderlo como plantilla, kit de UI, tema o starter kit.

Lo que conectas tú mismo

  • Formularios. El formulario de contacto y el de la página de inicio validan lo que escriben los visitantes, pero no envían nada hasta que los conectes a tu propio servicio.
  • Pagos. No se incluye ninguno. Los botones de los planes llevan a la página de contacto o al formulario de la página de inicio; para vender, apúntalos a tu propio checkout.
  • Elementos provisionales. Login, Book a call y los dos botones del hero esperan tus propios enlaces, y los textos, cifras, personas, precios y tarjetas de plantillas son contenido de ejemplo que debes reemplazar.

Ejemplos de uso

El contenido de ejemplo describe una plataforma inventada que vende componentes de interfaz y plantillas, pero el diseño sirve para cualquier oferta con planes y un paso de contacto:

  • Un software por suscripción, con planes mensuales y anuales, una tabla comparativa y preguntas frecuentes ya preparados.
  • Una consultora o una agencia, que usa los planes como paquetes de servicio que llevan a la página de contacto. La licencia cubre los sitios para clientes.
  • El sitio de un pequeño negocio que necesita tres páginas, un formulario de contacto y dos idiomas.
  • Un lanzamiento de producto o una campaña, usando solo la página de inicio.
  • Un negocio con clientes de habla árabe, ya que la versión en árabe está completa y se lee de derecha a izquierda.

Si el sitio también necesita un blog, páginas de inicio de sesión o un portafolio, elige otra plantilla de la comparación de abajo.

Primeros pasos, paso a paso

1. Descarga y ejecuta la plantilla

Descarga el ZIP desde Mis plantillas en tu panel de Aniq-UI, descomprímelo y abre una terminal en la carpeta Publino-template. Con Docker en marcha:

docker build -t publino-landing .
docker run -p 3030:3030 publino-landing

Sin Docker, instala Node.js 20.9 o posterior (se recomienda 22 o 24) y ejecuta:

corepack enable
yarn install
yarn dev

Abre localhost:3030 para inglés y localhost:3030/ar para árabe. Si el puerto está ocupado, usa yarn dev -p 3041.

2. Cambia el contenido

Todos los textos visibles están en messages/, en cuatro carpetas (common, home, pricing, contact) que contienen cada una un en.json y un ar.json. Cambia los dos archivos y mantén las mismas claves. Las dos secciones de precios leen sus precios de un único archivo pequeño, así que un precio se cambia en un solo lugar.

3. Cambia los colores y la marca

Los dos temas son valores de color en src/styles/theme.css: el claro bajo :root y el oscuro bajo [data-theme="dark"]. Cambia --interactive-primary para los botones principales o --background para el fondo de la página. El logo es un icono de cohete seguido del nombre del sitio, en src/layouts/Navbar/index.tsx, y los favicons y la imagen para compartir (public/image.png, de 1200 por 630 píxeles) son archivos de public/.

4. Conecta los formularios

Conecta cada formulario que conserves a tu API, a un servicio de formularios o a tu plataforma de correo, y elimina el otro. Definir NEXT_PUBLIC_RECAPTCHA_SITE_KEY añade una casilla de Google reCAPTCHA v2 al formulario de la página de inicio. Guarda las claves secretas en un servidor, porque cualquier valor NEXT_PUBLIC_ se puede leer en la página.

5. Define tu dirección y despliega

Define NEXT_PUBLIC_SITE_URL con tu dominio allí donde se ejecuta la construcción: los enlaces canónicos, los enlaces de idioma, el sitemap, robots.txt y las tarjetas para compartir se generan a partir de ella. Después despliega en Vercel desde un repositorio Git privado (añade ENABLE_EXPERIMENTAL_COREPACK=1), en un servidor Node.js con yarn build y yarn start detrás de Nginx o Caddy, o como imagen de Docker. Un host que solo sirve archivos estáticos no basta, porque es el servidor quien elige el idioma de cada visitante. Una vez publicado, comprueba que todas las direcciones de /sitemap.xml empiezan por tu dominio.

Publino frente a otras plantillas de landing page y de negocio de Aniq-UI

PlantillaTipoPáginasIdeal para
PublinoDe pago, Next.js 16Inicio, precios, contactoUn producto por suscripción o un negocio que necesita planes y un formulario de contacto
Plantilla SaaSDe pago, Next.js 16Inicio, precios, blog, contacto, páginas de inicio de sesión, páginas legales y de errorUn software que necesita blog y páginas de cuenta
Landing SaaSGratis, Next.js 15Una página, con precios y tabla comparativaUna landing page SaaS oscura sin coste
Sitio de EmpresaGratis, Next.js 15Una página, diez seccionesUna empresa o consultora en una sola página
Agencia Diseño WebGratis, Next.js 15Una página, con trabajos, proceso y formulario de contactoUna agencia o un freelance que muestra su trabajo
Landing 3DGratis, Next.js 15 y Three.jsUna página en torno a una rueda de productos en 3DEl escaparate de un producto, por ejemplo una marca de zumos

Las seis vienen en inglés y árabe. Elige Publino en lugar de la Plantilla SaaS cuando te basten tres páginas y quieras un tema claro además del oscuro.

Preguntas frecuentes

¿Qué páginas incluye Publino?

Tres: inicio, precios y contacto, cada una en inglés y en árabe bajo /ar. No hay página de blog.

¿Publino admite árabe y RTL?

Sí. Cada texto existe en inglés y árabe, y las páginas en árabe definen dir="rtl", así que todo el diseño se invierte. Puedes añadir más idiomas con next-intl.

¿Necesito un back end para ejecutar Publino?

No. Es una sola app Next.js sin base de datos ni back end, y no hace falta configurar nada antes de la primera ejecución. Solo necesitas un servicio para los formularios que conserves.

¿Publino puede cobrar pagos?

No. No incluye ningún servicio de pago, y los botones de los planes llevan a la página de contacto o al formulario de la página de inicio. Para vender, apúntalos a tu propio checkout.

¿Puedo usar Publino en proyectos para clientes?

Sí. La licencia comercial cubre proyectos ilimitados, trabajo para clientes incluido. No puedes revender el código fuente ni venderlo como plantilla.

¿Qué versión de Node.js necesita Publino?

Node.js 20.9 o posterior, y se recomienda 22 o 24. Con Docker no necesitas nada más, porque la imagen incluye Node.js 24.

Sobre Publino en concreto, la página de la plantilla Publino tiene la demo en vivo y el precio actual, y la documentación de Publino explica cada paso de instalación.

¿Encontró útil este artículo?

Compartir:
Boletín

Recibe un aviso cuando salga una nueva plantilla

Sé el primero en saber cuándo se publica una nueva plantilla.

  • Nuevas plantillas publicadas
  • Mira lo que se está creando y vota
  • Lanzamientos gratuitos y premium
  • Cancela la suscripción con un clic
world map

Comunidad Global de Usuarios

Únete a miles de desarrolladores en todo el mundo que confían en Aniq-UI para sus proyectos. Nuestras plantillas se utilizan en todo el mundo para crear experiencias web impresionantes.

Aniq-uiAniq-ui

Preferencias de Cookies

Utilizamos cookies para mejorar tu experiencia de navegación, analizar el tráfico del sitio y personalizar el contenido. Al hacer clic en "Aceptar Todo", consientes nuestro uso de cookies para análisis y publicidad personalizada.