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

Iconos de casa gratis (SVG)

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

Actualizado el

home
Lucidehome
Tablerhome
Heroiconshome
Iconoirhome-12-filled
Fluent UIhome
Material Symbolshome
Material Design Iconshome
Carbonhome-filled
Tablerhome-16-solid
Heroiconshome-alt
Iconoirhome-12-regular
Fluent UIhome-outline
Material Symbolshome-outline
Material Design Iconshome-2
Tablerhome-20-solid
Heroiconshome-sale
Iconoirhome-16-filled
Fluent UIhome-outline-rounded
Material Symbolshome-off
Material Design Iconshome-2-filled
Tablerhome-solid
Heroiconshome-user
Iconoirhome-16-regular
Fluent UIhome-rounded
Material Symbolshome-off-outline
Material Design Iconshome-x
Tablerhome-20-filled
Fluent UIadd-home
Material Symbolshome-city
Material Design Iconshome-up
Tablerhome-20-regular
Fluent UIadd-home-outline
Material Symbolshome-city-outline
Material Design Iconshome-cog
Tablerhome-24-filled
Fluent UIadd-home-outline-rounded
Material Symbolshome-edit
Material Design Iconshome-dot
Tablerhome-24-regular
Fluent UIadd-home-rounded
Material Symbolshome-edit-outline
Material Design Iconshome-eco
Tablerhome-28-filled
Fluent UIhome-max
Material Symbolshome-lock
Material Design Iconshome-off
Tablerhome-28-regular
Fluent UI

Uso de iconos de casa

La silueta de una casa es el enlace universal de vuelta a la página de inicio o al panel principal, normalmente al principio de la barra de navegación.

Todos los iconos aquí siguen currentColor, así que toman el color de texto del elemento en el que están: un mismo SVG funciona en fondos claros y oscuros, en enlaces y en botones. Define un width y un height explícitos (o dimensiónalos 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, dale a ese elemento un aria-label como “Inicio”.

Licencias

Estos iconos de casa provienen de Lucide, Tabler, Heroicons, Iconoir, Fluent UI, 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 más? Busca entre más de 70 000 iconos en el SVG Icon Finder.

Preguntas frecuentes

¿Son gratis estos iconos de casa para uso comercial?
Sí. Provienen de conjuntos de iconos de código abierto bajo 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 casa?
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.