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-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