devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt

Iconos de gráficos gratis (SVG)

48 iconos de gráficos gratis de conjuntos de código abierto: haz clic en uno para cambiar su tamaño, color y trazo, y cópialo como SVG, JSX, data URI o CSS.

Actualizado el

chart-line
Lucidechart-line
Tablerchart-bar
Heroiconschart-line
Phosphorbar-chart
Bootstrap Iconsadd-chart
Material Symbolschart-line
Material Design Iconschart-line
Carbonchart-bar
Lucidechart-bar
Tablerchart-bar-16-solid
Heroiconschart-bar
Phosphorbar-chart-fill
Bootstrap Iconsadd-chart-outline
Material Symbolschart-arc
Material Design Iconschart-3d
Carbonchart-pie
Lucidechart-pie
Tablerchart-bar-20-solid
Heroiconschart-bar-bold
Phosphorbar-chart-line
Bootstrap Iconsadd-chart-outline-rounded
Material Symbolschart-bar
Material Design Iconschart-bar
Carbonchart-area
Lucidechart-pie-filled
Tablerchart-bar-solid
Heroiconschart-bar-duotone
Phosphorpie-chart
Bootstrap Iconsadd-chart-outline-sharp
Material Symbolschart-box
Material Design Iconschart-pie
Carbonfile-chart-line
Lucidechart-ppf
Tablerchart-pie
Heroiconschart-bar-fill
Phosphorpie-chart-fill
Bootstrap Iconsadd-chart-rounded
Material Symbolschart-box-outline
Material Design Iconschart-area
Carbonchart-arcs
Tablerchart-pie-16-solid
Heroiconschart-bar-light
Phosphoradd-chart-sharp
Material Symbolschart-pie
Material Design Iconschart-ring
Carbonchart-area
Tablerchart-pie-20-solid
Heroicons

Uso de iconos de gráficos

Los iconos de gráfico de barras, de líneas y circulares marcan analíticas, informes y paneles de control.

Todos los iconos de aquí siguen currentColor, así que toman el color de texto del elemento en el que se encuentran: un mismo SVG funciona en fondos claros y oscuros, en enlaces y en botones. Define un width y un height explícitos (o ajústalos en CSS con 1em) para que el diseño no se desplace mientras carga la página.

Iconos accesibles

Si el icono es decorativo o va junto a texto visible, añade aria-hidden="true". Si es el único contenido de un botón o enlace, da a ese elemento un aria-label como “Gráfico”.

Licencias

Estos iconos de gráficos proceden de Lucide, Tabler, Heroicons, Phosphor, Bootstrap Icons, Material Symbols, Material Design Icons y Carbon: conjuntos de código abierto bajo licencias MIT, ISC o Apache 2.0, que permiten el uso personal y comercial. ¿Necesitas algo distinto? Busca entre más de 70.000 iconos en el SVG Icon Finder.

Preguntas frecuentes

¿Son gratuitos para uso comercial estos iconos de gráficos?
Sí. Proceden de conjuntos de iconos de código abierto con licencias MIT, ISC o Apache 2.0, que permiten el uso comercial. Conserva el aviso de licencia si redistribuyes los propios archivos de iconos.
¿Cómo cambio el color de un icono de gráfico?
Los SVG usan currentColor, así que define el color CSS del elemento padre o abre el icono en el buscador y elige un color fijo antes de copiarlo.
¿Puedo usar estos iconos en Webflow o React?
Sí. Abre un icono y usa Copy to Webflow (pega un Code Embed) o Copy JSX para un componente de React.