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

Ícones de Casa Grátis (SVG)

48 ícones de casa grátis de bibliotecas open source. Clique em um para mudar tamanho, cor e traço, e copie como SVG, JSX, data URI ou CSS.

Atualizado em

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

Como usar ícones de casa

O formato de casa é o link universal de volta para a página inicial ou para o painel principal, geralmente o primeiro item de uma barra de navegação.

Todos os ícones aqui seguem currentColor, então assumem a cor do texto do elemento em que estão, e um mesmo SVG funciona em fundos claros e escuros, em links e em botões. Defina um width e um height explícitos (ou dimensione-os no CSS com 1em) para que o layout não se mova enquanto a página carrega.

Ícones acessíveis

Se o ícone é decorativo ou fica ao lado de um texto visível, adicione aria-hidden="true". Se ele for o único conteúdo de um botão ou link, dê a esse elemento um aria-label, como “Início”.

Licenças

Estes ícones de casa vêm de Lucide, Tabler, Heroicons, Iconoir, Fluent UI, Material Symbols, Material Design Icons e Carbon, todos bibliotecas open source sob licenças MIT, ISC ou Apache 2.0, que permitem uso pessoal e comercial. Precisa de outra coisa? Busque entre mais de 70.000 ícones no SVG Icon Finder.

Perguntas frequentes

Esses ícones de casa são grátis para uso comercial?
Sim. Eles vêm de bibliotecas open source sob licenças MIT, ISC ou Apache 2.0, que permitem uso comercial. Mantenha o aviso de licença se você redistribuir os próprios arquivos dos ícones.
Como mudo a cor de um ícone de casa?
Os SVGs usam currentColor, então defina a propriedade color no CSS do elemento pai. Ou abra o ícone no buscador e escolha uma cor fixa antes de copiar.
Posso usar esses ícones no Webflow ou no React?
Sim. Abra um ícone e use Copy to Webflow (cola um Code Embed) ou Copy JSX para um componente React.