Refine By

System components

System components are the UI elements that come directly from iOS or Android OS without any customizations from our end.

The benefits of using system components include:

  • Easier maintenance after a system upgrade
  • Accessibility considerations
  • Improved usability, since users are familiar with native controls

Below is a list of the system components we use on Android and iOS.

General

System Component App Styled iOS doc Android doc
Greys Both No iOS Guidelines Android Guidelines
System icons (not all) Both No iOS Guidelines Android Guidelines

Controls

System Component App Styled iOS doc Android doc
Button
Text Button
Both Color only iOS Guidelines Android Guidelines
Checkbox Both Color only - Android Guidelines
Chips Android Yes - Android Guidelines
Dividers Both No - Android Guidelines
Expand and collapse Both No iOS Guidelines Android Guidelines
FAB - Floating Action Button Android - System
iOS - Custom
Color, icon  - Android Guidelines
More ??? No - -
Overflow Menu/Action sheet Both No - Android Guidelines
Page Controls Both Default iOS Guidelines Android Guidelines
Picker Both No iOS Guidelines Android Guidelines
Radio Button Both Color only - Android Guidelines
Reorder/Gripper Both Default - Android Guidelines
Segmented Control iOS Color iOS Guidelines -
Slider Both Color only iOS Guidelines Android Guidelines
Switch Both Color only iOS Guidelines Android Guidelines
Tabs / Tab layout Android - system
iOS - custom
No - Android Guidelines
Textfield Both No iOS Guidelines Android Guidelines
Textfield - multiline
edit text
Both No iOS guidelines Android Guidelines

System feedback

System Component App Styled iOS doc Android doc
Dialog Both Text Button color iOS Guidelines Android Guidelines
Process indicator Both No iOS Guidelines Android Guidelines

Spinner Android Guidelines
Search Bar / Search View Both Icons iOS Guidelines Android Guidelines
Snackbar Android - system
iOS - custom
Text Button color - Android Guidelines
Nav Bar / Top App Bar Both Color iOS Guidelines Android Guidelines
Tab Bar / Bottom Navigation Both Color iOS Guidelines Android Guidelines