Home
Parts of Design System
1 of 3: Cross out 5
irrelevant
categories.
Name:
Email:
Visual language
Color
Palettes
Contrast
Meaning
Swatches
Typography
Hierarchy
Weights / types
Web fonts
Baseline grid
Iconography
Pictograms
Illustration
Icon fonts
Alignment
Motion
Principles
Timing
Types
Transitions
Space
Units / measurments
Metrics and keylines
Structure
Photography
UI elements
Paragraph
Lead paragraph
Block quote
Headers (H1 - H6)
Lists
Links
Code
Divider / rule
Units / measurments
Buttons
Primary
Secondary
Button groups
Menu buttons
Split buttons
FAB (floating action)
Image
Block
Full bleed
Inline with positions
Circled
Form controls
Text
Variants (email, etc)
Text area
Radio
Checkbox
Select
File upload
Labels
Floating labels
Microcopy
Required
Validation
UI components
Action bar/sheet
Back to top
Badges
Breadcrumbs
Calendar picker
Caption
Cards
Chat (live)
Code block
Comments
Contact us
Cookie notification
Data tables
Dialog
Drawer/accordion
Filters
Footer
Footnotes
Header
Hero billboard
Hero carousel
Legend
Loading / spinner
Local navigation
Maps
Menu
Messaging
Toast
Block
Inline error
Modal
Nav Megamenu
Pagination
Progress bar
Pull quote
Ratings
Reviews
Rich text editor
Search
Sidebar
Site/App navigation
Social networking
Status (alpha, beta,...)
Tabs
Tags / chips / pills
Thumbnails / #-ups
Tips / tutorial
Toolbar
Tooltips
Video & media
UI patterns
Authentication
Create account
Database connection
Form structure
Launch
Permissions
Purchase/checkout
Settings
Site / app structure
Swipe to refresh
Page templates
Home
Category
Product
Dashboard
Article
Search results
Contact us
Getting started
Discussion
Gallery
Layout system
Grids for sites
Grids for apps
Paneling/transitions
Responsive/breakpoints
Screen sizes
Editorial
Voice & tone
Writing for the web
Word list
Capitalization
Punctuation
Branding
Identity
Logo(s)
Tagline(s)
Partnerships
Themes
Research & users
User needs
Personas
Research techniques
Surveys
A/B, multivar. testing
Practices
Accessibility
Prototyping
Performance
SEO
Design thinking
Coding standards
Style
Browsers & devices
Environments
Prog. enhancement
Version control
Downloads
Templates (PSD,...)
Swatch palettes
Fonts
Icons
Code
Getting involved
Request New Parts
Give Feedback
Request Audit
Present at a Share
Contribute
About the program
Home page
Principles / pillars
Getting started
FAQ
Version history
About the team
Team
Recruiting / jobs
Utilities
Variables / tokens
Mixins
Helpers
Customize
Cross out 5 more