Un mockup de navegador hace que tu diseño web se vea profesional en una presentación. En vez de enseñar una captura suelta, la metes dentro de una ventana de Chrome, Safari o Firefox y gana muchÃsimo. Aquà tienes mockups en PSD para editar con Photoshop y generadores online para hacerlo en segundos.
He actualizado el listado: hoy lo más rápido no es siempre un PSD, sino una herramienta web donde subes tu captura y sale lista. Te dejo las dos vÃas.
Generadores online (lo más rápido)
Si solo quieres meter tu captura en una ventana bonita y descargar, estas herramientas lo hacen sin abrir Photoshop.
Shots.so
Subes tu captura, eliges marco de navegador, fondo y sombra, y descargas en alta calidad. Mi favorito para presentaciones rápidas y limpias.
Licencia: gratis (con opciones de pago) · Ir a Shots.so
Screely
Convierte una captura en una imagen con ventana de navegador y fondo de color en un clic. Muy directo, ideal para redes y blogs.
Licencia: gratis · Ir a Screely
Figma (comunidad)
Si trabajas en Figma, en la comunidad hay cientos de mockups de navegador gratis. Los duplicas a tu archivo y pones tu diseño dentro con un componente.
Licencia: gratis (revisar cada recurso) · Ver en Figma Community
Mockups de navegador en PSD
Si prefieres control total y editar sombras, reflejos o fondo a tu gusto, tira de PSD y Photoshop.
Freepik
La mayor colección de mockups de navegador en PSD, con objetos inteligentes para colocar tu diseño en un doble clic. Filtra por «gratis».
Licencia: gratis con atribución (freemium) · Ver en Freepik
Alienvalley · navegador plano transparente
Un mockup de navegador tipo flat, transparente y en PSD. Sencillo, ligero y fácil de personalizar. Un clásico que sigue funcionando.
Licencia: gratis (revisar términos) · Ver en Alienvalley
¿Necesitas mockups muy realistas, con dispositivos y escenas montadas? Ahà las bibliotecas premium te dan un acabado de estudio en minutos.
Tip: Para mockups realistas de navegador y dispositivos con objeto inteligente, mira los mockups de navegador en Envato Elements.
Más mockups y recursos PSD
Preguntas frecuentes
¿Qué es un mockup de navegador y para qué sirve?
Es una plantilla con la forma de una ventana de navegador donde colocas tu diseño web. Sirve para presentar proyectos a clientes o en tu portfolio de forma más realista y atractiva que una captura sola.
¿PSD o generador online?
Generador online (Shots.so, Screely) si quieres rapidez y no editar nada. PSD si necesitas control total sobre fondo, sombras y composición. Para el dÃa a dÃa, el generador gana; para una presentación cuidada, el PSD.
¿Necesito Photoshop para los PSD?
SÃ, o Photopea, que es gratis y abre archivos .psd en el navegador. Los mockups suelen traer un objeto inteligente donde pegas tu diseño y se ajusta solo.
¿Puedo usar estos mockups para clientes?
La mayorÃa sÃ, pero revisa la licencia. Los gratis de Freepik piden atribución o cuenta premium; los de Envato ya incluyen licencia comercial. Comprueba siempre los términos antes de entregar.
Y hasta aquà los mockups de navegador para presentar tus webs. Si te han servido, compártelos: a ti te lleva un momento y a mà me ayuda un montón.
