SVG Nexus / EXPLAINER Sin Registro | 100% en tu Navegador

¿Qué es SVG?

SVG (gráficos vectoriales escalables) es el formato del navegador para iconos, logos e ilustraciones: código XML que queda nítido en cada tamaño y cambia de color con un atributo.

SVG en un minuto

Un archivo SVG es texto plano. Se abre en un navegador, un editor de texto o una herramienta de diseño; se lee como HTML y los colores, tamaños y formas cambian sin pérdida de calidad. Por eso las interfaces, logos y botones viajan en vector.

SVG Nexus indexa bibliotecas de iconos SVG e ilustraciones de código abierto para buscar, recolorear y copiar código listo en React, Vue, HTML, CSS o tu herramienta de diseño, sin cuenta ni subidas.

Escala sin límite

Las rutas son matemáticas, no píxeles: el mismo archivo sigue nítido como favicon de 16px, logo retina o gráfico 4K.

Cambia de color con un atributo

Cambia fill o stroke una vez y la marca entera sigue. Los keyframes CSS y el hover funcionan en SVG inline sin JavaScript.

El texto es ligero

Los iconos se comprimen a kilobytes, se envían con gzip desde cualquier servidor y siguen legibles para buscadores y lectores de pantalla.

Copia código SVG para cualquier stack

Ver todas las herramientas

Cada página del catálogo y cada SVG subido se abre en una herramienta del navegador que reescribe el código para tu framework: JSX, Vue, Svelte, CSS, data URI, exportaciones PNG y sprites.

Editor vectorial SVG interactivo

Editor vectorial en el navegador sin demoras para colores, grosor del trazo, viewBox, transformaciones, márgenes, fondos y exportación instantánea a SVG/PNG.

Conversor de SVG a React JSX, Vue y Svelte

Transforma los atributos SVG sin procesar en componentes TypeScript React (TSX), Next.js Server Component, Vue 3 <script setup>, Svelte 5, Flutter y Angular limpios.

Conversor de SVG a PNG y WebP en alta resolución

Rasteriza cualquier icono SVG o código personalizado en imágenes PNG o WebP nítidas desde 64px hasta 2048px, con control de la transparencia.

Conversor de SVG a CSS y Data URI

Convierte el código SVG en Data URI compactas y seguras para URLs (UTF-8 o Base64), reglas CSS background-image y snippets mask-image con currentColor.

Generador de matrices de iconos SVG y badges

Síntesis paramétrica de iconos SVG con marcos squircle/hexagonales personalizados, degradados de varias paradas, badges de estado y exportación instantánea para frameworks.

Optimizador y minificador de SVG

Minifica el SVG en tu navegador: elimina metadatos del editor, comentarios y restos de XML, compacta los espacios y comprueba el ahorro real de bytes.

Encuentra iconos SVG por tema

Ver todas las categorías

El catálogo agrupa iconos en temas como transporte, finanzas, medicina, clima y días festivos. Abre cualquier tema para explorar y copiar los vectores en segundos.

¿SVG o PNG?

Usa SVG para iconos y gráficos de interfaz que deben escalar y recolorear; exporta PNG o WebP para detalle fotográfico, vistas previas sociales o plataformas que rasterizan. Las herramientas aquí producen ambos desde un archivo fuente.

SVG vs PNG: ¿Qué Formato Debes Usar? SVG en linea frente a etiqueta de imagen Cómo Editar Iconos SVG en Figma o en el Navegador Todas las guías

Gratis para uso comercial

Cada fila de icono lleva su biblioteca y licencia de origen. Los packs MIT, ISC y Apache-2.0 cubren productos comerciales; los logos de marca siguen reglas propias, siempre en la tabla de licencias.

Licencias →

Bibliotecas de iconos de código abierto

Material Icons Phosphor Icons selfh.st Icons Tabler Icons Authentic Brand Logos Domain Icons

Icon libraries →

Preguntas de SVG, respondidas

¿SVG es mejor que PNG?

Para iconos, logos y arte de interfaz, sí: SVG escala, recolorea y pesa menos porque guarda instrucciones de dibujo, no píxeles. PNG sigue siendo útil para bitmaps detallados.

¿Cómo abro y edito un archivo SVG?

Arrástralo a un navegador, a un editor de texto o a una herramienta de diseño. SVG Nexus Studio lo abre en el navegador para editar colores, capas y trazos sin instalar nada.

¿Puedo usar los iconos comercialmente?

Las bibliotecas de código abierto de aquí usan MIT, ISC, Apache-2.0 y licencias similares que permiten el uso comercial. Cada página de icono nombra su licencia exacta; los logos de marca tienen reglas adicionales.

¿Por qué se ve borroso mi SVG?

Un SVG borroso suele significar que se rasterizó antes de tiempo o se exportó con un viewport equivocado. Manténlo vectorial hasta el render final o vuelve a exportarlo desde el archivo original.

Empieza con un recurso SVG

Busca en el catálogo, abre cualquier recurso en el estudio del navegador y entrega código vectorial limpio: iconos, logos, ilustraciones y las herramientas que los transforman.

Todos los iconos SVG Abrir en editor

Licencia	Uso comercial	Atribucion	Modificar o recolorear
MIT	Permitido	Aviso en el paquete	Permitido
ISC	Permitido	Aviso en el paquete	Permitido
Apache-2.0	Permitido	Obligatorio con archivo de aviso	Permitido
CC BY 4.0	Permitido	Credito obligatorio	Permitido
CC-BY-SA-4.0	Permitido	Compartir igual	Compartir igual
Trademark / Brand	Solo uso referencial	Guias del dueno	Restringido