Sarah Miller

Icons

PrimeFaces components internally use PrimeIcons library, the official icons suite from PrimeTek.

Getting Started

PrimeIcons use the pi pi-{icon} syntax such as pi pi-check. A standalone icon can be displayed using an element like i or span


<i class="pi pi-check"></i>
<i class="pi pi-times"></i>

Size

Size of the icons can easily be changed using font-size property.


<i class="pi pi-check"></i>


<i class="pi pi-check" style="font-size: 2rem"></i>

Spinning Animation

Special pi-spin class applies continuous rotation to an icon.


<i class="pi pi-spin pi-spinner" style="font-size: 2rem"></i>

List of Icons v5.0.0

Here is the current list of PrimeIcons, more icons are added periodically. You may also request new icons at the issue tracker.

pi-sort-alt-slash
pi-arrows-h
pi-arrows-v
pi-pound
pi-prime
pi-chart-pie
pi-reddit
pi-code
pi-sync
pi-shopping-bag
pi-server
pi-database
pi-hashtag
pi-bookmark-fill
pi-filter-fill
pi-heart-fill
pi-flag-fill
pi-circle
pi-circle-fill
pi-bolt
pi-history
pi-box
pi-at
pi-arrow-up-right
pi-arrow-up-left
pi-arrow-down-left
pi-arrow-down-right
pi-telegram
pi-stop-circle
pi-stop
pi-whatsapp
pi-building
pi-qrcode
pi-car
pi-instagram
pi-linkedin
pi-send
pi-slack
pi-moon
pi-sun
pi-youtube
pi-vimeo
pi-flag
pi-wallet
pi-map
pi-link
pi-credit-card
pi-discord
pi-percentage
pi-euro
pi-book
pi-shield
pi-paypal
pi-amazon
pi-phone
pi-filter-slash
pi-facebook
pi-github
pi-twitter
pi-step-backward-alt
pi-step-forward-alt
pi-forward
pi-backward
pi-fast-backward
pi-fast-forward
pi-pause
pi-play
pi-compass
pi-id-card
pi-ticket
pi-file-o
pi-reply
pi-directions-alt
pi-directions
pi-thumbs-up
pi-thumbs-down
pi-sort-numeric-down-alt
pi-sort-numeric-up-alt
pi-sort-alpha-down-alt
pi-sort-alpha-up-alt
pi-sort-numeric-down
pi-sort-numeric-up
pi-sort-alpha-down
pi-sort-alpha-up
pi-sort-alt
pi-sort-amount-up
pi-sort-amount-down
pi-sort-amount-down-alt
pi-sort-amount-up-alt
pi-palette
pi-undo
pi-desktop
pi-sliders-v
pi-sliders-h
pi-search-plus
pi-search-minus
pi-file-excel
pi-file-pdf
pi-check-square
pi-chart-line
pi-user-edit
pi-exclamation-circle
pi-android
pi-google
pi-apple
pi-microsoft
pi-heart
pi-mobile
pi-tablet
pi-key
pi-shopping-cart
pi-comments
pi-comment
pi-briefcase
pi-bell
pi-paperclip
pi-share-alt
pi-envelope
pi-volume-down
pi-volume-up
pi-volume-off
pi-eject
pi-money-bill
pi-images
pi-image
pi-sign-in
pi-sign-out
pi-wifi
pi-sitemap
pi-chart-bar
pi-camera
pi-dollar
pi-lock-open
pi-table
pi-map-marker
pi-list
pi-eye-slash
pi-eye
pi-folder-open
pi-folder
pi-video
pi-inbox
pi-lock
pi-unlock
pi-tags
pi-tag
pi-power-off
pi-save
pi-question-circle
pi-question
pi-copy
pi-file
pi-clone
pi-calendar-times
pi-calendar-minus
pi-calendar-plus
pi-ellipsis-v
pi-ellipsis-h
pi-bookmark
pi-globe
pi-replay
pi-filter
pi-print
pi-align-right
pi-align-left
pi-align-center
pi-align-justify
pi-cog
pi-cloud-download
pi-cloud-upload
pi-cloud
pi-pencil
pi-users
pi-clock
pi-user-minus
pi-user-plus
pi-trash
pi-window-minimize
pi-window-maximize
pi-external-link
pi-refresh
pi-user
pi-exclamation-triangle
pi-calendar
pi-chevron-circle-left
pi-chevron-circle-down
pi-chevron-circle-right
pi-chevron-circle-up
pi-angle-double-down
pi-angle-double-left
pi-angle-double-right
pi-angle-double-up
pi-angle-down
pi-angle-left
pi-angle-right
pi-angle-up
pi-upload
pi-download
pi-ban
pi-star-fill
pi-star
pi-chevron-left
pi-chevron-right
pi-chevron-down
pi-chevron-up
pi-caret-left
pi-caret-right
pi-caret-down
pi-caret-up
pi-search
pi-check
pi-check-circle
pi-times
pi-times-circle
pi-plus
pi-plus-circle
pi-minus
pi-minus-circle
pi-circle-on
pi-circle-off
pi-sort-down
pi-sort-up
pi-sort
pi-step-backward
pi-step-forward
pi-th-large
pi-arrow-down
pi-arrow-left
pi-arrow-right
pi-arrow-up
pi-bars
pi-arrow-circle-down
pi-arrow-circle-left
pi-arrow-circle-right
pi-arrow-circle-up
pi-info
pi-info-circle
pi-home
pi-spinner

Theme Customization

Poseidon offers different themes for layout, topbar, menu etc.
Menu Mode
Layout Mode
Form Type
Theme