Ω FABShape

Base: The shape and size of the Floating Action Button (FAB) is set at this level. FAB's have two layers a background surface and a label (icon or icon with text). The background shape and standardized sizes are set in this area.

Styleguide Link

• Parent: FAB

• Child: Label

Properties

Shape

• Circle (default)

• Squircle

• Rounded Box

• Square

Size

The design system has set sizes for certain objects, the FAB is one of those with the following standardized sizes following the 8 point grid system. Note that the nested Label (Icon) element also follows a standardized sizing.

• Tiny - This one acts as a really small indicator

• Extra Small

• Small

• Medium (Default)

• Medium Extended - This one allows both the icon and text

Note: For smaller FAB's the hit area (48dp), which is hidden remains larger.