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

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

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

Обновлено

music-3
Lucidemusic
Tablermusic-note
Phosphorfile-music
Bootstrap Iconsmusic-note
Iconoirmusic-note-1-20-filled
Fluent UImusic-off
Material Symbolsmusic
Material Design Iconsmusic
Carbonfile-music
Lucidemusic-x
Tablermusic-note-bold
Phosphorfile-music-fill
Bootstrap Iconsmusic-note-solid
Iconoirmusic-note-1-20-regular
Fluent UImusic-off-rounded
Material Symbolsmusic-box
Material Design Iconsmusic-add
Carbonlist-music
Lucidemusic-up
Tablermusic-note-duotone
Phosphormusic-note
Bootstrap Iconsmusic-note-1-24-filled
Fluent UImusic-cast
Material Symbolsmusic-box-outline
Material Design Iconsmusic-remove
Carbonmusic-cog
Tablermusic-note-fill
Phosphorapple-music
Bootstrap Iconsmusic-note-1-24-regular
Fluent UImusic-cast-rounded
Material Symbolsmusic-off
Material Design Iconsmusic-off
Tablermusic-note-light
Phosphormusic-player
Bootstrap Iconsmusic-note-2-16-filled
Fluent UImusic-note
Material Symbolsbook-music
Material Design Iconsmusic-pin
Tablermusic-note-thin
Phosphormusic-player-fill
Bootstrap Iconsmusic-note-2-16-regular
Fluent UImusic-note-rounded
Material Symbolsbook-music-outline
Material Design Iconsfile-music
Tablermusic-notes
Phosphormusic-note-2-20-filled
Fluent UImusic-video
Material Symbols

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

Музыкальные ноты обозначают аудио, плейлисты и настройки звука.

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

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

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

Лицензии

Эти иконки музыки взяты из наборов Lucide, Tabler, 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?
Да. Откройте иконку и используйте «Скопировать для Webflow» (вставит Code Embed) или «Скопировать JSX» для компонента React.