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 appimg
directory ad a black icon/app/files/img/app.svg