Skip to content
Docs

App icons

These are the icons registered in sylva-enterprise/src/config/icons.js and rendered by Quasar’s iconMapFn. They come in three flavours:

  • Sprite icons are symbols inside public/icons.svg, rendered with <svg><use href="…">. The mapping carries a viewBox.
  • Standalone SVG icons live as individual files under src/assets/icons/ and render through Quasar’s img: prefix.
  • Material aliases are entries that delegate to a Material Icons name (see Material icons).

Use any of them in templates with the registered key, for example:

<q-icon name="app:search" size="md" />

The gallery below is regenerated by npm run sync:icons; do not edit by hand.

Sprite icons (svguse:)

Section titled “Sprite icons (svguse:)”
app:accentCard
app:activity
app:align-after
app:align-before
app:align-bottom
app:align-center-horizontal
app:align-center-vertical
app:align-left
app:align-over
app:align-right
app:align-space-evenly-horizontal
app:align-space-evenly-vertical
app:align-top
app:archive
app:arrow-bottom
app:arrow-left
app:arrow-right
app:assets
app:bell
app:bookmark
app:box
app:brush
app:card
app:certificate
app:chapter
app:chat
app:check-box
app:check-group
app:code
app:column
app:comment
app:corner-export
app:corner-import
app:css-file
app:dashboard
app:delete
app:done
app:dots
app:editor
app:embed
app:exam
app:export
app:formula-fx
app:forward-arrow
app:game
app:game-shapes
app:graph
app:grid
app:header
app:home
app:image
app:import
app:join-right
app:js-file
app:json-file
app:label-code
app:label-embed
app:label-graph
app:label-grid
app:label-heading
app:label-image
app:label-pdf
app:label-slide
app:label-table
app:label-text
app:label-video
app:link
app:lock
app:mail
app:partiallyCorrect
app:party
app:party-popper
app:pdf
app:pen
app:people
app:people-add
app:people-student
app:phone
app:poll
app:preview
app:publish
app:question
app:questionCard
app:quiz
app:results
app:section
app:self-test
app:send-group
app:slide
app:slider
app:slider-half
app:slider-random
app:slider-zero
app:start
app:survey
app:table
app:text
app:text-editor
app:timer
app:titleCard
app:unit
app:video

Standalone SVG icons (img:)

Section titled “Standalone SVG icons (img:)”
app:announcement
app:attachment
app:award
app:back
app:bad-smile
app:black-triangle
app:calendar
app:check
app:check-list
app:chili
app:chiliOutlined
app:correct
app:download
app:duplicate
app:edit
app:emojiLove
app:emojiLoveOutlined
app:emojiParty
app:emojiPartyOutlined
app:emojiStarEyes
app:emojiStarEyesOutlined
app:facebook-circle
app:good-smile
app:group-chat
app:horn
app:incorrect
app:invisible
app:layout
app:linkedin-circle
app:logo
app:ok-smile
app:people-admin
app:people-chat
app:people-group
app:performance
app:progress
app:right-arrow
app:search
app:send
app:share-link
app:signature
app:smiley
app:sortingAsc
app:star
app:start-course
app:time
app:twitter-circle
app:unlock
app:up-arrow
app:waiting
course-player:module-intro-graphic

Material aliases

Section titled “Material aliases”
error
app:error
→ error
error
app:incomplete
→ error
edit_off
app:unanswered
→ edit_off