Ω 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

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.

Previousε FABNextε Field

Last updated