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

Бесплатные иконки «поделиться» (SVG)

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

Обновлено

share
Lucideshare
Tablershare
Heroiconsshare
Phosphorshare
Bootstrap Iconsshare-ios
Iconoirshare-16-filled
Fluent UIshare
Material Symbolsshare
Material Design Iconsshare
Carbonshare-2
Lucideshare-2
Tablershare-16-solid
Heroiconsshare-bold
Phosphorshare-fill
Bootstrap Iconsshare-16-regular
Fluent UIshare-outline
Material Symbolsshare-outline
Material Design Iconsdata-share
Carbonshare-3
Tablershare-20-solid
Heroiconsshare-duotone
Phosphorshare-20-filled
Fluent UIios-share
Material Symbolsios-share
Material Design Iconseye-share
Tablershare-solid
Heroiconsshare-fill
Phosphorshare-20-regular
Fluent UIios-share-rounded
Material Symbolsshare-all
Material Design Iconsmap-share
Tablershare-light
Phosphorshare-24-filled
Fluent UIios-share-sharp
Material Symbolsshare-all-outline
Material Design Iconsshare-off
Tablershare-thin
Phosphorshare-24-regular
Fluent UIshare-eta
Material Symbolsshare-off
Material Design Iconsbell-share
Tablershare-fat
Phosphorshare-28-filled
Fluent UIshare-eta-rounded
Material Symbolsshare-off-outline
Material Design Iconsflag-share
Tablershare-fat-bold
Phosphor

Использование иконок «поделиться»

Иконки «поделиться» открывают окно отправки или копируют ссылку; коробка со стрелкой в стиле iOS и соединённые точки в стиле Android узнаются одинаково хорошо.

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

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

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

Лицензии

Эти иконки взяты из наборов Lucide, Tabler, Heroicons, Phosphor, Bootstrap Icons, 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, поэтому задайте CSS-свойство color для родительского элемента — или откройте иконку в поиске и выберите фиксированный цвет перед копированием.
Можно ли использовать эти иконки в Webflow или React?
Да. Откройте иконку и используйте «Copy to Webflow» (вставит Code Embed) или «Copy JSX» для React-компонента.