Home
Web Apps
- Web Apps Overview
- Design Toolkits
- Documentation
- Version 3 stable
- Version 4 stable
iOS
Android

Sitemap
Contact Us
Collaborate on Teams
GitHub

Version 3 stable
Version 4 stable

Web Apps Overview Setup

CDN / Preferred NPM / Managed Dependencies Pre-built React

Design Toolkits Component Samples Themes

Overview Gray / Light

Gray / Dark

Blue / Light

Blue / Dark

Grid System

Overview

Container Fluid Container Columns Offsets

Foundations

Typography

Roboto Headings Text Weights Text Alignment Body Text Contextual Alternatives Lists Blockquotes Monospace Keyboard Shortcuts Code Snippets

Iconography

Font Awesome Color Meaning

Colors

Brand Contextual Alternatives Backgrounds Palette

Material / Shadows

Basic Whiteframe / Card Depth

Raised Buttons

Styles Usage Sizes Dropdowns / Dropups Block Buttons Groups Radio / Checkbox Groups Toolbars

Flat Buttons

Styles Sizes Dropdowns / Dropups Block Buttons Groups Radio / Checkbox Groups Toolbars

Icon Buttons

Basic Styled Segmented

Floating Action Buttons

Basic Mini Speed Dial

Overview Input Types

Text Inputs Static Control Checkboxes Switches Radios Select / Multi-select File Browser Date / Time Pickers Form Buttons

Input Sizes Input Groups

Text Addons Checkbox / Radio Addons Button Addons Dropdown Addons

Help Text Validation States Required and Optional Inputs Horizontal Forms

Text Inputs Static Control Checkboxes Switches Radios Select / Multi-select File Browser Date / Time Pickers Form Buttons

Inline Forms

Basic Borderless Forms Search Forms

Sliders

Navbar

Default Inverse Depth Contextual Buttons

Banner Bar

Internal External Brand Logo

Bottom Nav Drawer / Sidebar

Default Inverse Backdrop Overflow Collapsible Groups

Dropdowns Toolbars

Basic Primary Action Inputs Sizes Flat Variant

Tabs

Basic Inverse Variant Pill Variant Stacked Pills

Steppers

Vertical Variant Horizontal Variant

Breadcrumbs Pagination

Default Round Variant Pager

Panels / Cards

Basic Flat Panels Hoverable Panels Sections Contextual Alternatives Expandable Groups

List Groups

Basic Separators Custom Content

Jumbotron Splash Screen

Static Active

Wells

Progress Indicators

Progress Bar Spinner

Alerts Badges / Labels

Tables

Basic Striped Rows Condensed Rows Mixed Content

Images Media Objects Chips

Tooltips Popovers Dialogs / Modals Toasts

Toast Container Block Toast Pill Toast

Borders

Additive Subtractive Color

Display

Notation Examples

Flex

Enable Flex Layout Direction Justify Content Align Items Align Self Auto Margins Wrap Order Align Content

Sizing

Width Height

Spacing

How It Works Notation

Charts and Graphs

Color Palettes

Categorical Data Semantic Data Sequential Data

Typography

Font Families Font Weights

Chart Types

Bar Chart (Horizontal) Bar Chart (Vertical) Line Chart

External Website

Login Page

Web App

Website

Table

Tabbed Card

Tabbed Card Table

Advanced Search

Splash Screen

Built with Bootstrap 3 B

Borders

Utilities for styling element borders.

Contents
Additive
Subtractive
Color

Additive

Subtractive

Color

Third-party Content Disclaimer