We utilize this component to allow users to make a selection from given options.
Our library provides this component per se with no specific limitations how to use it. We don't specify how to use checkbox in context of other components or how to format layout of the screen where there is need to use and display more complex components (i.e. cards) as a list of options which users can select from.
Format
Label
Use short label to express what user selects. If there is a need to provide longer additional information use complementary text in combination of checkbox component. Additional information will give user full context on available selection options.
Examples of use
You can use checkbox in following or similar use cases:
- User makes a change (ON/OFF) in system settings
- User consents Terms & Conditions or accepts other important information from the service
- User selects assets to be downloaded or removed from the device
- User makes a selection from available in-product survey options
- User consents collection of data for personalisation purposes (Cookies)
Modifiers
We have checkbox prepared to be used in light and dark themed interfaces. Select appropriate theme accordingly.
Mobile apps
Figma library provides support for checkbox component on web platform only. Use native component (Toggle for iOS) in mobile apps where appropriate.
Related resources
-> Specs in Figma (Web component only)