Icons

List of available icons

White icons only have a grey background on this documentation page for readability purposes.

icon-add

icon-add-white

icon-address

icon-address-white

icon-audio

icon-audio-white

icon-audio-off

icon-audio-off-white

icon-caret-white

icon-caret-dark

icon-checkmark

icon-checkmark-white

icon-checkmark-color

icon-clippy

icon-clippy-white

icon-close

icon-close-white

icon-comment

icon-comment-white

icon-confirm

icon-confirm-white

icon-download

icon-download-white

icon-confirm-fade

icon-delete

icon-delete-white

icon-details

icon-details-white

icon-edit

icon-edit-white

icon-error

icon-error-white

icon-error-color

icon-external

icon-external-white

icon-fullscreen

icon-fullscreen-white

icon-history

icon-history-white

icon-info

icon-info-white

icon-logout

icon-logout-white

icon-mail

icon-mail-white

icon-menu

icon-menu-white

icon-menu-sidebar

icon-menu-sidebar-white

icon-more

icon-more-white

icon-password

icon-password-white

icon-pause

icon-pause-white

icon-play

icon-play-white

icon-play-add

icon-play-add-white

icon-play-next

icon-play-next-white

icon-play-previous

icon-play-previous-white

icon-projects

icon-projects-white

icon-public

icon-public-white

icon-quota

icon-quota-white

icon-rename

icon-rename-white

icon-screen

icon-screen-white

icon-template-add

icon-template-add-white

icon-screen-off

icon-screen-off-white

icon-search

icon-search-white

icon-settings

icon-settings-dark

icon-settings-white

icon-shared

icon-shared-white

icon-sound

icon-sound-white

icon-sound-off

icon-sound-off-white

icon-favorite

icon-star

icon-star-white

icon-star-dark

icon-starred

icon-tag

icon-tag-white

icon-timezone

icon-timezone-white

icon-toggle

icon-toggle-white

icon-toggle-background

icon-toggle-background-white

icon-toggle-pictures

icon-toggle-pictures-white

icon-toggle-filelist

icon-toggle-filelist-white

icon-triangle-e

icon-triangle-e-white

icon-triangle-n

icon-triangle-n-white

icon-triangle-s

icon-triangle-s-white

icon-upload

icon-upload-white

icon-user

icon-user-white

icon-group

icon-group-white

icon-filter

icon-filter-white

icon-video

icon-video-white

icon-video-off

icon-video-off-white

icon-video-switch

icon-video-switch-white

icon-view-close

icon-view-download

icon-view-pause

icon-view-play

icon-view-next

icon-view-previous

icon-disabled-user

icon-disabled-user-white

icon-disabled-users

icon-disabled-users-white

icon-user-admin

icon-user-admin-white

icon-alert-outline

icon-alert-outline-white

icon-calendar

icon-calendar-dark

icon-contacts

icon-contacts-dark

icon-files

icon-files-dark

icon-file

icon-filetype-file

icon-folder

icon-folder-white

icon-filetype-folder

icon-filetype-folder-drag-accept

icon-home

icon-home-white

icon-link

icon-link-white

icon-music

icon-music-white

icon-picture

icon-picture-white

icon-desktop

icon-desktop-white

icon-phone

icon-phone-white

icon-tablet

icon-tablet-white

icon-category-installed

icon-category-enabled

icon-category-disabled

icon-category-app-bundles

icon-category-updates

icon-category-files

icon-category-social

icon-category-office

icon-category-auth

icon-category-monitoring

icon-category-multimedia

icon-category-organization

icon-category-customization

icon-category-integration

icon-category-tools

icon-category-games

icon-category-security

icon-category-search

icon-category-workflow

icon-category-dashboard

Svg color api

More informations about scss and this api: scss mixins and functions

You can request and color any svg icons used in nextcloud with this api. The server will directly change the colours of the circle, rect and path elements in the svg you provide. Simply use those urls:

https://yourdomain/svg/core/actions/menu?color=ffffff Will serve the svg located in the core/img directory as a white icon /core/img/actions/menu.svg
https://yourdomain/svg/core/places/calendar?color=0082c9 Will serve the svg located in the core/img directory with the color #0082c9 /core/img/places/calendar.svg
https://yourdomain/svg/files/app?color=000000 Will serve the svg located in the files app img directory ad a black icon /app/files/img/app.svg