Toggle
Toggle examples
Get started with the default toggle component example as a checkbox element to receive a true or false selection from the user.
<script>
import { Toggle } from 'flowbite-svelte'
</script>
<Toggle>Toggle me</Toggle>
<Toggle checked>Checked toggle</Toggle>
<Toggle disabled>Disabled toggle</Toggle>
<Toggle checked disabled>Disabled checked</Toggle>Colors
<Toggle color="red" checked>Red</Toggle>
<Toggle color="green" checked>Green</Toggle>
<Toggle color="purple" checked>Purple</Toggle>
<Toggle color="yellow" checked>Yellow</Toggle>
<Toggle color="teal" checked>Teal</Toggle>
<Toggle color="orange" checked>Orange</Toggle>Sizes
<Toggle size="small">Small toggle</Toggle>
<Toggle size="default" checked>Default toggle</Toggle>
<Toggle size="large" checked>Large toggle</Toggle>Props
The component has the following props, type, and default values. See types page for type information.
Toggle
| Name | Type | Default |
|---|---|---|
| size | 'small' | 'default' | 'large' | 'default' |
| group | string[] | [] |
| value | string | '' |
| checked | boolean | undefined |
| color | FormColorType | 'blue' |
| inline | boolean | false |