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

Бесплатные иконки дома (SVG)

48 бесплатных иконок дома из наборов с открытым кодом — нажмите на любую, чтобы изменить размер, цвет и толщину обводки, и скопируйте её как SVG, JSX, data URI или CSS.

Обновлено

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

Использование иконок дома

Силуэт домика — универсальная ссылка на главную страницу или основную панель, обычно первый пункт в навигационной панели.

Все иконки здесь следуют currentColor, поэтому они берут цвет текста элемента, в котором находятся: один SVG работает на светлом и тёмном фоне, в ссылках и кнопках. Задайте явные width и height (или управляйте размером в CSS через 1em), чтобы верстка не смещалась во время загрузки страницы.

Доступность иконок

Если иконка декоративная или стоит рядом с видимым текстом, добавьте aria-hidden="true". Если она — единственное содержимое кнопки или ссылки, задайте этому элементу aria-label, например «Главная».

Лицензии

Эти иконки дома взяты из наборов Lucide, Tabler, Heroicons, Iconoir, Fluent UI, Material Symbols, Material Design Icons и Carbon — наборов с открытым кодом под лицензиями MIT, ISC или Apache 2.0, которые разрешают личное и коммерческое использование. Нужны другие иконки? Ищите среди более 70 000 иконок в SVG Icon Finder.

Часто задаваемые вопросы

Можно ли бесплатно использовать эти иконки дома в коммерческих проектах?
Да. Они взяты из наборов иконок с открытым кодом под лицензиями MIT, ISC или Apache 2.0, которые разрешают коммерческое использование. Сохраняйте уведомление о лицензии, если распространяете сами файлы иконок.
Как изменить цвет иконки дома?
SVG использует currentColor, поэтому задайте свойство color в CSS для родительского элемента — или откройте иконку в поиске и выберите фиксированный цвет перед копированием.
Можно ли использовать эти иконки в Webflow или React?
Да. Откройте иконку и используйте «Копировать для Webflow» (вставит Code Embed) или «Копировать JSX» для React-компонента.