Here is list of all the components that compose the Framework

For more concrete examples, visit the Examples page

On this page, you'll find :

Typography

Roboto

Lorem ipsum dolor sit amet

Headers

Material Design

Noto

Lorem ipsum dolor sit amet

Headers

Material Design

Blockquote

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor cum, quia eaque quos? Aut nemo deleniti debitis neque praesentium eius aliquid nihil possimus natus. Voluptate ea possimus nobis consectetur quisquam.

Grid

1 .bit-1

1/2 .bit-2

1/3 .bit-3

1/4 .bit-4

1/5 .bit-5

1/6 .bit-6

1/7 .bit-7

1/8 .bit-88

1/8 .bit-8

1/9 .bit-9

1/10 .bit-10

1/11 .bit-11

1/12 .bit-12

Lists

Item
Item
Item
Item
Item
Item

Item
Item
Item
Item
Item
Item

Inline Lists

Forms

Inputs

Checkbox

Radio

Range

Buttons

Raised buttons

I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button I'm a button

Flat Buttons

I'm a button I'm a button I'm a button I'm a button I'm a button

Buttons with icons

Remove Add My location Notifications Switch Camera Star it

Flat Buttons with icons

Remove Add My location Notifications Switch Camera Star it

Buttons Float

Navbar

Without ripples, left aligned

With ripples, left aligned

Without ripples, right aligned

With ripples, right aligned

Without ripples, right aligned and subnavigation

With ripples, right aligned and subnavigation

Cards

A simple card

Some text..

A simple card

Some text..

Card with divider

Some text..

Card with divider

Some text..

Progress-bars

Determinate

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus deleniti sunt, minima atque debitis nostrum natus mollitia veritatis reiciendis et ducimus amet eaque alias iste impedit, quisquam quae eum odit!

Fixed

70% 40% 70% 80%

Animated

70% 40% 60% 80%

Indeterminate

Animated

70% 40% 60% 80%

Spinners

Spinner

Determinate

Indeterminate

Snackbars

Show snackbar bottom left Show snackbar bottom right Show snackbar top right Show snackbar top left

Toasts

Show Toast bottom left Show Toast bottom right Show Toast top right Show Toast top left