Checkbox & Radio Buttons

Use this collection of interface elements to repurpose and help build applications. The purpose is to work as efficiently as possible to allow you to focus on solving challenges. If there is a component you need and isn’t listed, please submit your request to Web. The ticket will be reviewed for design/implementation.

Checkbox/Radio

Extra Steps:

Although a checkbox/radio does not require Javascript to function it is recommended so the checkbox's label trigger a change in the input and provide callback functions. Additionally, some states like indeterminate can only be triggered with Javascript. To use javascript use: $('.ui.checkbox').checkbox();

Basic Checkbox

A standard accordion.

checkbox

Code Example


Basic Radio

A checkbox can be formatted as a radio element. This means it is an exclusive option.

radio

Code Example


Inline

A checkbox or radio can be inline.

inline

Code Example


Grouped

A checkbox or radio can be grouped.

grouped

Code Example


Toggle

A checkbox can be formatted to show an on or off choice.

toggle

Code Example


Usage & Settings

For information on behaviors that are accessible with Javascript using the syntax: See Usage Information

To view information on checkbox/radio: See Setting Information.