Zywave, Inc.Zywave, Inc.Zywave, Inc.Zywave, Inc.
AccountsContact card with user icon ActivitiesSquare with a check mark in itAdministratorsSilhouette of a person with a wrench in front of their torsoAdmin ConsoleTwo gearsCarrierA shieldClient PortalA silhouette of a figure within a circleCompliance AppsA grid of buttons, with one being filled by a checkmarkCommunicationsTwo overlapping word bubbles with the top one including ellipsis inside of itCommunityFour perpendicular circles connected to each other by a lineAgenciesA buildingComponentsOne hexagonConceptsA lightbulbContentFileCourse CatalogA book with a list on the coverCourse PackagesA three dimensional cubeCredentialsA keyLicensesA card with a head and shoulders silhouette and three linesDevelopersGreater than sign, slash, less than signDisease ProfilesA disease profileDomainsA browserEmail MarketingBullhornFilesFolder iconFoundationsSix rectangles stacked into a pyramidFrom your brokerA piece of paper with an arrow on itGet StartedRocketshipGroup managementThree figures behind a gearHandbookA book stamped with an icon resembling a personHelp & trainingA question mark within a speech bubbleHomeA house with a gable roofHR AppsA grid of buttons, with one being filled by the silhouette of a personHR HotlineTalking bubble with phone insideImport request queueA square with an intersecting diagonal arrow pointing at the bottom-left cornerIntegrationsA gear with a right-arrow intercepting through to the centerListsA document with a list on itLMSManage userA person with a gear in front of themModsThree vertical bars in a bar chartNoticesAn open envelope marked by an exclamation pointNotificationsA notification bellOrganizationA building in front with two buildings behind itOSHA LogA contruction coneNav PackagesAn opened boxPatternsThree hexagons fitted together with a flat sideNav Plan SelectorA mouse cursor arrow overlapping a rectanglePortal adminA wrenchQuoting and RenewalsMoney with dollar signQuoting and Renewals UKMoney with £ signProspectingTargetRegistered AppsBoxes with checkmarkSettingsA gearSingle Sign-OnDoor with number 1SolutionsA lightbulbSpecificationsA gear with 2-by-3 quadralaterals that make a listToolboxA toolboxUsersThree silhouettes of figures grouped togetherZywave SidebarA hollow rectangle with a solid vertical rectangle aligned to the right sideAdminA detailed close up of a wrenchBrandingUpside down tear drop half coloredGeneric placeholder iconAn illustration of two triangle shapes forming mountains with a circle at the top right to indicate the sun encapsulated in a thick dashed square frame with round cornersReportsA piece of paper with a line graph and a pie chartResourcesStack of papers with horizontal lines
AppsA grid of squares to represent different applications to open and launchShell ImpersonationAn icon indicating impersonation of another user's profileMenuA menu icon with three horizonal bars stacked
Add To Action ItemsA clipboard with a plus in the corner to indicate adding to action itemsAddAn addition symbolBuildingAn illustrative icon of a buildingCalendarA gridded day calendarCaret DownTriangle pointing downwardCaret LeftTriangle pointing leftCaret RightTriangle pointing rightCaret UpTriangle pointing upCheckCheckmark iconChevron DownA chevron pointing downChevron LeftA chevron pointing leftChevron RightA chevron pointing rightChevron UpA chevron pointing upCopyTwo overlapping rectangles to indicate a copyDeleteTrashcan iconDetailsA circle with a lowercase "I" in the middle to indicate infoDocDocument icon with lines on itDouble Chevron LeftTwo chevron arrows pointing leftDouble Chevron RightTwo chevron arrows pointing rightDownChevron arrow pointing downDownloadAn arrow pointing downEditA pencil illustrationErrorAn octagon with an ! within it to indicate a errorExcelA document shaped paper with an X on it to indiciate it's an Microsoft Excel fileExternalTwo squares, one overlapping the bottom one. Top square has an arrow pointing away, as if leading you awayFile DropA folded page with a line through it inside of a folder to indicate a file being dragged and dropped to a destinationFilterA funnel style filterFolderA folder iconGridFour squares with space between them to indicate a gridGripA grid of six squares to illustrate something that has texture or grippableAdd to GroupA stack of pages with the corner folded and a plus sign in the corner to indicate adding to a groupHelpA question mark within a speech bubbleImpersonationA figure wearing a mask to disguise their faceAdd IndicatorA circle with a plus in the middle, to symbolize an additive action.Backslash IndicatorA circle with a slash in the middle, to symbolize something isn't allowed.Failure IndicatorA circle with the letter X in the middle, to symbolize failure.Remove IndicatorA circle with a minus in the middle, to symbolize removal.Success IndicatorA circle with a checkmark in the middle, to symbolize success.Warning IndicatorA triangle with an ! within it to indicate a warningInfoA filled circle with the letter I cut out from the center, to symbolize informationLeftAn arrow pointing leftLinkA chain linkListA list of itemsLockA paddle lockMailA mailing envelopeMoreThree dots, like an ellipsisMove ToAn envelope with an arrow pointing to the rightMP3A document shaped paper with MP3 on it to indicate the file is a .MP3MP4A document shaped paper with MP4 on it to indicate the file is a .MP4Multiple FilesA document icon with lines and another document behind it to signify multiple documentsNew FileA folded page with a plus in the corner to indicate a new fileNew FolderAn envelope with a plus sign in the corner to indicate a new folderPDFA document shaped paper with the letters PDF on it to indicate the file is a .PDFPhoneA telephone handset that is ringingPowerpointA document shaped paper with the letter P on it to indicate the file is Microsoft PowerpointPrintOffice printerRefreshAn arrow in the shape of a circle to indicate refresh or reloadRemoveAn X iconRenameA rectangle with a capitalized "I" through it to indicate renamingReportingAn outline of a graph with barsRightAn arrow pointing rightRocketA cartoon rocket shipSearchA mangifying glass icon, to indicate searching for somethingShareA document with an arrow emerging from the content on the page. Indicates sharing contentsShared With YouA circle above a curved line, like a person holding something. Above the line is a curved arrow pointing to the right.SortUp and down arrows pointing away from one another to indicate sorting or re-sortingSuccessA circle with a checkmark within to indicate a successSwitch profileArrows pointing different directions, indicative of switchingTableFour horizontal lines with space between them to indicate a tableUnlockAn unlocked paddle lockUpAn arrow pointing upUploadAn arrow facing upUserAn outlined silhouette of a personVideoA document shaped icon with a triangle on it, indicating a video fileWarningA triangle with an ! within it to indicate a warningWordA document shaped paper with the letter W on it to indicate the file is a Microsoft Word docWrenchA toolbox wrench
AudioA folded page with a note to indicate an audio fileCodeA folded page with to indicate a generic fileDocDocument icon with lines on itFolderA folder iconImageTwo overlapping triangles and a circle to look like a sun over mountains, indicating an imageMultiple FilesA document icon with lines and another document behind it to signify multiple documentsVideoA document shaped icon with a triangle on it, indicating a video file7zA .7z fileZipA .zip fileMP3A document shaped paper with MP3 on it to indicate the file is a .MP3WavA .wav fileAiAn .ai fileEpsAn .eps fileGifA .gif fileJpgA .jpg filePngA .png filePsA .ps filePsdA .psd fileTifA .tif filePDFA document shaped paper with the letters PDF on it to indicate the file is a .PDFPowerpointA document shaped paper with the letter P on it to indicate the file is Microsoft PowerpointWordA document shaped paper with the letter W on it to indicate the file is a Microsoft Word docExcelA document shaped paper with an X on it to indiciate it's an Microsoft Excel fileCssA .css fileHtmlAn .html fileJavaA .java fileXmlAn .xml file DocA .doc fileTxtA .txt fileMovA .mov fileMpgA .mpg fileMP4A document shaped paper with MP4 on it to indicate the file is a .mp4
Stable

Icons

Visual representation of features and actions users can take.

Navigation icons provide our users with an easily recognizable visual for parent-level items within the Sidenav or Topbar. Combined with their text labels, they will speed up recognition and processing of the link text. Navigation icons are especially important when the user has collapsed the Sidenav as they are the only item immediately visible to the user.

Our Navigation icons fit into two groups: canonized and generic. Most of our icons are canonized and have a consistent meaning. Any time a user sees a canonized icon they should know exactly what page they will be taken to. On the contrary, when a generic icon is used, the page a user is taken to may differ slightly based on the product they are accessing it from.



Canonized icons

Canonized icons should never be reused to represent more than one feature or tool.



Account management

zui-nav-accounts



Administrators

zui-nav-administrators



Agencies

zui-nav-company



Carrier info

zui-nav-carrier



Client Portal

zui-nav-client-portal



Communications

zui-nav-communications



Compliance apps

zui-nav-compliance-apps



Community

zui-nav-community



Components

zui-nav-components



Concepts

zui-nav-concepts



Content library

zui-nav-content



Course catalog

zui-nav-course-catalog



Course packages

zui-nav-course-packages



Credentials

zui-nav-credentials



Developers

zui-nav-developers



Disease profiles

zui-nav-disease-profiles



Domains

zui-nav-domains



Email marketing

zui-nav-email-marketing



Files

zui-nav-files



Foundations

zui-nav-foundations



From your broker

zui-nav-from-your-broker



Get started

zui-nav-get-started



Group Management

zui-nav-group-management



Handbooks

zui-nav-handbook



Help and training

zui-nav-help



Home

zui-nav-home



HR apps

zui-nav-hr-apps



HR Hotline

zui-nav-hr-hotline



Import request queue

zui-nav-import-request-queue



Integrations

zui-nav-integrations



Lists

zui-nav-lists



LMS

zui-nav-lms



Manage users

zui-nav-manage-user



Mods

zui-nav-mods



Notices

zui-nav-notices



Notifications

zui-nav-notifications



Organizations

zui-nav-organization



OSHA log

zui-nav-osha-log



Packages

zui-nav-packages



Patterns

zui-nav-patterns



Plan selector

zui-nav-plan-selector



Portal admin

zui-nav-portal-admin



Proposals

zui-nav-proposals



Proposals (UK)

zui-nav-proposals-uk



Prospecting

zui-nav-prospecting



Registered apps

zui-nav-registered-apps



Settings

zui-nav-settings



Single sign on

zui-nav-single-sign-on



Solutions

zui-nav-solutions



Specifications

zui-nav-specifications



Toolbox

zui-nav-toolbox



Users

zui-nav-users



Zywave sidebar

zui-nav-zywave-sidebar

Generic icons

Generic icons have a more general meaning and can be used to represent more than one feature or tool.



Admin

zui-nav-generic-admin



Branding

zui-nav-generic-branding



Generic placeholder*

zui-nav-generic-placeholder



Reports

zui-nav-generic-reports



Resources

zui-nav-generic-resources

* The generic placeholder icon should never make it to production in any of our products. It should only be used as a temporary icon while another is being created to represent the new parent-level menu item.

Shell icons

These icons are used specifically in Shell's 2 core sections: topbar and sidenav. Shell icons help identify major navigational features and different user states in applications.



Apps

zui-shell-apps



Impersonation

zui-shell-impersonation



Menu

zui-shell-menu

System Icons

Our system icons are a set of line icons that can be used throughout the UI to draw more attention to a specific element or action. Typically our system icons are used to the left of the text label within buttons to help draw more attention to them. Or, if the icon is easily identifiable, the icon can be used alone within a button in order to save space.

Standard system icons



Add

zui-add



Add to Action Items

zui-action-items-add



Building

zui-building



Calendar

zui-calendar



Caret Down

zui-caret-down



Caret Left

zui-caret-left



Caret Right

zui-caret-right



Caret Up

zui-caret-up



Check

zui-check



Chevron Down

zui-chevron-down



Chevron Left

zui-chevron-left



Chevron Right

zui-chevron-right



Chevron Up

zui-chevron-up



Copy

zui-copy



Delete

zui-delete



Details

zui-details



Document

zui-doc



Double Chevron Left

zui-double-chevron-left



Double Chevron Right

zui-double-chevron-right



Down

zui-down



Download

zui-download



Edit

zui-edit



Excel File

zui-excel



External

zui-external



File drop

zui-file-drop



Filter

zui-filter



Folder

zui-folder



Grid

zui-grid



Grip

zui-grip



Group add

zui-group-add



Help

zui-help



Impersonation

zui-impersonation



Left

zui-left



Link

zui-link



List

zui-list



Locked

zui-lock



Mail

zui-mail



More

zui-more



Move To

zui-move-to



MP3

zui-mp3



MP4

zui-mp4



Multiple Files

zui-multiple-files



New File

zui-new-file



New Folder

zui-new-folder



PDF

zui-pdf



Phone

zui-phone



PowerPoint

zui-ppt



Print

zui-print



Refresh

zui-refresh



Remove

zui-remove



Rename

zui-rename



Reporting

zui-reporting



Right

zui-right



Rocket

zui-rocket



Search

zui-search



Share

zui-share



Shared With

zui-shared-with



Sort

zui-sort



Switch Profile

zui-switch-profile



Table

zui-table



Unlocked

zui-unlock



Up

zui-up



Upload

zui-upload



User

zui-user



Video

zui-video



Word Document

zui-word



Wrench

zui-wrench

Status/type indicator icons



Add Indicator

zui-indicator-add



Backslash Indicator

zui-indicator-backslash



Failure Indicator

zui-indicator-failure



Remove Indicator

zui-indicator-remove



Success Indicator

zui-indicator-success



Warning Indicator

zui-indicator-warning



Error

zui-error



Info

zui-info



Success

zui-success



Warning

zui-warning

File system icons

All file system icons have a default color to help users make connections with other, non-Zywave systems. Grayscale is available for edge case scenarios, and should be used rarely.



Audio File

zui-fs-audio



Code File

zui-fs-code



Generic document

zui-fs-doc



Folder

zui-fs-folder



Generic Image File

zui-fs-image



Multiple Files

zui-fs-multiple-files



Generic Video File

zui-fs-video



7-Zip Archive File

zui-fs-7z



Zip File

zui-fs-zip



MP3 File

zui-fs-mp3



WAV File

zui-fs-wav



Adobe Illustrator File

zui-fs-ai



EPS File

zui-fs-eps



GIF File

zui-fs-gif



JPG File

zui-fs-jpg



PNG File

zui-fs-png



Adobe PostScript File

zui-fs-ps



Adobe Photoshop File

zui-fs-psd



TIF File

zui-fs-tif



PDF File

zui-fs-pdf



Microsoft PowerPoint File

zui-fs-ppt



Microsoft Word File

zui-fs-word



Microsoft Excel File

zui-fs-excel



CSS File

zui-fs-css



HTML File

zui-fs-html



Java File

zui-fs-java



XML File

zui-fs-xml



Doc File

zui-fs-doc



TXT File

zui-fs-txt



MOV File

zui-fs-mov



MPG File

zui-fs-mpg



MP4 File

zui-fs-mp4

Deprecated icons


Deprecated iconReplacement iconDeprecation date
zui-nav-admin
zui-nav-generic-admin
2021-11-08
zui-nav-color-themes
zui-nav-generic-branding
2021-11-08
zui-nav-menu
zui-shell-menu
2021-11-08
zui-nav-org-overview
zui-nav-company
2021-11-08
zui-nav-reports
zui-nav-generic-reports
2021-11-08
zui-nav-resources
zui-nav-generic-resources
2021-11-08
zui-nav-zywave-university
zui-nav-lms
2021-11-08
zui-add-circle
zui-indicator-add
2021-11-08
zui-align
zui-nav-lists
2021-11-08
zui-apps
zui-shell-apps
2021-11-08
zui-check-circle
zui-indicator-success
2021-11-08
zui-close
zui-remove
2021-11-08
zui-close-circle
zui-indicator-failure
2021-11-08
zui-minus
zui-remove
2021-11-08
zui-remove-circle
zui-indicator-remove
2021-11-08
zui-warning-circle
zui-indicator-warning
2021-11-08

Feedback