Design Pattern Library 1.5
General Guidelines
Using the Design Pattern Library
About the Patterns
About the Components
Desktop/Web
Browser Support
Windows
Window Layout
Screen Resolution
Title Bars
Title Bar Controls
Installers
General Guidelines
Consoles
Login
Portals
Quick-Action Bars
Dashboards
Panes
Tile Views
Workspaces
Single Application
Navigation
Fly-Out Drawers
Breadcrumbs
Tree Views
Tabs
Menus
Forms
Validation
Error Messages
Labels/Required Fields
href="forms-inline-messaging.php">Inline Messaging
Edit in Place
Status/Progress Indicators
Tab Indexes
Input Prompts
Selection
Disabled Fields
Structured Format
Search
Grids/Tables
Complex Grids
Inline Editing
Sorting
Filtering
Dialog Boxes
Modals
SuperBox
Wizards
Messages
Errors
Warnings
Notifications
Confirmations
Progressive Disclosure
UI Controls
Buttons
Check Boxes
Color Picker
Date Picker/Calendar
Drop Down List
Groups and Separators
Links
List Boxes
Progress Indicators
Radio Buttons
Sliders
Snap-Drag Controls
Spin Controls
Text Boxes
Toolbars
UI Text (IDD)
Data Visualization
Pie Charts
Bar Charts
Line Charts
Bubble Charts
Topologies
Mobile (Tablet & Phone)
Resolutions
Gestures
On-Screen Gestures
Kinesthetic Gestures
Touch
UI Controls
Buttons
Check Boxes
Color Picker
Date Picker/Calendar
Drop Down List
Combo Box
Groups and Separators
Links
List Boxes
Progress Indicators
Radio Buttons
Scrollbars
Sliders
href="mobile-snap-drag-controls.php">Snap-Drag Controls
Spin Controls
Status Indicators
Text Boxes
Toolbars
Screen Orientation
Page Composition
Scroll
Annunciator Row
Notifications
Titles
Revealable Menu
Fixed Menu
Home and Idle Screens
Interstitial Screen
Display of Information
Vertical List
Infinite List
Thumbnail List
Fisheye List
Carousel
Grid
Filmstrip
Slideshow
Select List
Control and Confirmation
Confirmation
Sign On
Exit Guard
Cancel Protection
Timeout
Revealing More
Windowshade
Popup
Hierarchical List
Returned Results
Widgets
Tabs
Peel Away
Simulated 3D Effects
Pagination
Indicator
Icons
Stack of Items
Annotations
Tooltip
Avatar
Wait Indicator
Reload, Sync, Stop
Zoom and Scale
Location Jump
Search Within
Sort and Filter
Input and Output
Input Method Indicator
Autocomplete and Prediction
href="mobile-directional-entry.php">Directional Entry
Press and Hold
Focus and Cursors
Input Areas
Form Selections
Mechanical Style Controls
Clear Entry
Tones
Voice Input
Voice Readback
Voice Notifications
Haptic Output
Visual Design Guidelines
Color Palettes
Typography
Desktop / Web
Tablet
Theming Guidelines
Spin Controls
Spin Controls
Content here.
Solution
Content here.
Get Code
Code
HTML
CSS
SASS
code here
Variations
Content here
How
Content here.
Antipatterns
Content here
Examples