> Deprecated: > Product subscription app extensions won't be supported as of December 3, 2025. You should migrate existing product subscription app extensions to [purchase options extensions](/docs/apps/build/purchase-options/purchase-options-extensions). Checkboxes are most commonly used to give merchants a way to make a range of selections (zero, one, or multiple). ```ts?title: "JavaScript" import {extend, ExtensionPoint, Checkbox} from '@shopify/admin-ui-extensions'; extend('Playground', (root) => { const checkbox = root.createComponent(Checkbox, { label: 'Opt in to something cool', checked: true, onChange: () => console.log('Checked'), }); root.appendChild(checkbox); root.mount(); }); ``` ```jsx?title: "React" import React from 'react'; import {extend, render, ExtensionPoint, Checkbox} from '@shopify/admin-ui-extensions-react'; function App() { return ( console.log('Checked')} /> ); } extend( 'Playground', render(() => ), ); ``` ## Props optional = ? | Name | Type | Description | | --- | --- | --- | | label? | string | Label for the checkbox. | | checked? | boolean | Checkbox is selected. | | value? | boolean | Alias for `checked`, to support iterating over multiple types of form fields. If both `checked` and `value` are used, `checked` is the source of truth. | | onChange? | (value: boolean) => void | Promise<void> | Callback when checkbox is toggled. | ## Guidelines | ✅ Do | 🛑 Don't | | ------------------------------------------------------ | ----------------------------- | | Use Checkboxes to give merchants a multi select choice | Horizontally stack Checkboxes | | Vertically align Checkboxes | | For more guidelines, refer to Polaris' [Checkbox best practices](https://polaris.shopify.com/components/selection-and-input/checkbox#best-practices).