Ir al contenido
SVG Nexus / DEVELOPERS Sin Registro | 100% en tu Navegador

Documentación para desarrolladores

Biblioteca de iconos vectoriales y 3D para desarrolladores y disenadores

Anade el catalogo de 76,166 iconos, la API de busqueda JSON y componentes sin dependencias a tus proyectos React, Next.js, Vue 3, Svelte, Tailwind CSS o PHP.

1. API de busqueda JSON y facetas (GET /api/icons)

Filtra por palabra clave, carpeta de biblioteca, categoria, estilo o licencia. La respuesta devuelve iconos paginados con SVG seguro, sugerencias y facetas coincidentes.

GET /api/icons?q=arrow&library=lucide&category=arrows&style=outline&license=ISC&page=1&limit=48&facets=1

2. Rutas directas de archivos vectoriales

# Folder-scoped SVG asset (all 15 active folders supported):
GET /icon-library-assets/{libraryId}/{slug}.svg

# Legacy flat slug endpoint:
GET /icon-assets/{slug}.svg

# Upstream SPDX license notice file:
GET /icon-library-notices/{libraryId}/LICENSE.txt

3. Patron de componente sin dependencias

import * as React from 'react';

export function NexusArrowRightIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 24 24"
      width="24"
      height="24"
      fill="none"
      stroke="currentColor"
      strokeWidth={2}
      strokeLinecap="round"
      strokeLinejoin="round"
      {...props}
    >
      <path d="M5 12h14" />
      <path d="m12 5 7 7-7 7" />
    </svg>
  );
}

Guías Prácticas y Tutoriales de SVG

SVG vs PNG: ¿Qué Formato Debes Usar?

Usa SVG para iconos web, logotipos e interfaces porque los vectores se ven nítidos en cualquier pantalla. Usa PNG cuando necesites una imagen de píxeles fijos para correos electrónicos o redes sociales.

Cómo Animar Iconos SVG con CSS

Añade una clase CSS a tu etiqueta SVG en línea y aplica keyframes con transform o stroke-dasharray. Nuestro editor genera animaciones fluidas a 60fps sin necesidad de JavaScript.

Cómo Editar Iconos SVG en Figma o en el Navegador

Copia el código SVG desde SVG Nexus y pégalo directamente en Figma o Illustrator para editar nodos y colores. También puedes abrir cualquier icono en nuestro Estudio Vectorial sin instalar programas.

Cómo Usar Iconos SVG en React, Next.js y Vue

Selecciona la pestaña React TSX o Vue 3 en cualquier página de icono para copiar un componente listo para producción compatible con currentColor y Tailwind CSS.

Escribe para buscar entre 76,166 iconos vectoriales...

Navegar | Enter para abrir Explorar todos los iconos

Comparar

Fuente y licencia del icono

Licencia Uso comercial Atribucion Modificar o recolorear
MITPermitidoAviso en el paquetePermitido
ISCPermitidoAviso en el paquetePermitido
Apache-2.0PermitidoObligatorio con archivo de avisoPermitido
CC BY 4.0PermitidoCredito obligatorioPermitido
CC-BY-SA-4.0PermitidoCompartir igualCompartir igual
Trademark / BrandSolo uso referencialGuias del duenoRestringido

Vista previa del icono