DNN Version: 09.02.00
• 1 minute to read
Persona Bar Style Guide
[top]
Evoq Color Palette
![Evoq Color Palette](/images/gra-pbarstyles-01-evoq-color-palette.png)
[top]
![Large Buttons](/images/gra-pbarstyles-04-large-buttons.png)
[top]
![Small Buttons](/images/gra-pbarstyles-05-small-buttons.png)
[top]
Label
![Label](/images/gra-pbarstyles-20-label.png)
[top]
![Tool Tips](/images/gra-pbarstyles-16-tool-tips.png)
[top]
Large Single-Line Text Field
![Large Single-Line Text Field](/images/gra-pbarstyles-06-large-single-line-text-field.png)
[top]
Small Single-Line Text Field
![Small Single-Line Text Field](/images/gra-pbarstyles-07-small-single-line-text-field.png)
[top]
Multi-Line Text Field
![Multi-Line Text Field](/images/gra-pbarstyles-08-multi-line-text-field.png)
[top]
Large Dropdown
![Large Dropdown](/images/gra-pbarstyles-09-large-dropdown.png)
[top]
Small Dropdown
![Small Dropdown](/images/gra-pbarstyles-10-small-dropdown.png)
[top]
Searchable Pill Field
![Searchable Pill Field](/images/gra-pbarstyles-22-searchable-pill-field.png)
[top]
On / Off Switch
![On / Off Switch](/images/gra-pbarstyles-11-on-off-switch.png)
[top]
![Radio Button](/images/gra-pbarstyles-12-radio-button.png)
[top]
Check Box
![Check Box](/images/gra-pbarstyles-24-check-box.png)
[top]
Primary Tabs - Workspace Tray
![Primary Tabs - Workspace Tray](/images/gra-pbarstyles-13-primary-tabs-workspace-tray.png)
[top]
Secondary Tabs - Workspace Tray
![Secondary Tabs - Workspace Tray](/images/gra-pbarstyles-14-secondary-tabs-workspace-tray.png)
[top]
Control Bar - Workspace Tray
![Control Bar - Workspace Tray](/images/gra-pbarstyles-15-control-bar-workspace-tray.png)
[top]
Date Picker
![Date Picker](/images/gra-pbarstyles-17-date-picker.png)
[top]
Date And Time Picker
![Date And Time Picker](/images/gra-pbarstyles-18-date-and-time-picker.png)
[top]
Date Range Picker
![Date Range Picker](/images/gra-pbarstyles-19-date-range-picker.png)
[top]
Page Selector
![Page Selector](/images/gra-pbarstyles-23-page-selector.png)
[top]
Image Upload Field
![Image Upload Field](/images/gra-pbarstyles-21-image-upload-field.png)
[top]
Notification Iconography
![Notification Iconography](/images/gra-pbarstyles-25-notification-iconography.png)
[top]
Minimum Width Notification
![Minimum Width Notification](/images/gra-pbarstyles-26-minimum-width-notification.png)
[top]
Maximum Width Notification
![Maximum Width Notification](/images/gra-pbarstyles-27-maximum-width-notification.png)
[top]
Maximum Height Notification
![Maximum Height Notification](/images/gra-pbarstyles-28-maximum-height-notification.png)
[top]
![Button Notification](/images/gra-pbarstyles-29-button-notification.png)
[top]
Loader Bar
![Loader Bar](/images/gra-pbarstyles-30-loader-bar.png)
[top]
Back-to Link
![Back-to Link](/images/gra-pbarstyles-32-back-to-link.png)
[top]
Breadcrumb Navigation
![Breadcrumb Navigation](/images/gra-pbarstyles-33-breadcrumb-navigation.png)