diff --git a/packages/builder/src/components/design/AppPreview/componentStructure.json b/packages/builder/src/components/design/AppPreview/componentStructure.json
index 98f2ca1aa0..9c34c20a14 100644
--- a/packages/builder/src/components/design/AppPreview/componentStructure.json
+++ b/packages/builder/src/components/design/AppPreview/componentStructure.json
@@ -12,6 +12,7 @@
       "stringfield",
       "numberfield",
       "optionsfield",
+      "booleanfield",
       "richtext",
       "datepicker"
     ]
diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BooleanFieldSelect.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BooleanFieldSelect.svelte
new file mode 100644
index 0000000000..51b459bf23
--- /dev/null
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BooleanFieldSelect.svelte
@@ -0,0 +1,5 @@
+<script>
+  import FormFieldSelect from "./FormFieldSelect.svelte"
+</script>
+
+<FormFieldSelect {...$$props} type="boolean" />
diff --git a/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte b/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte
index 3709e9da66..74d7837b14 100644
--- a/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte
@@ -20,6 +20,7 @@
   import StringFieldSelect from "./PropertyControls/StringFieldSelect.svelte"
   import NumberFieldSelect from "./PropertyControls/NumberFieldSelect.svelte"
   import OptionsFieldSelect from "./PropertyControls/OptionsFieldSelect.svelte"
+  import BooleanFieldSelect from "./PropertyControls/BooleanFieldSelect.svelte"
 
   export let componentDefinition = {}
   export let componentInstance = {}
@@ -64,6 +65,7 @@
     "field/string": StringFieldSelect,
     "field/number": NumberFieldSelect,
     "field/options": OptionsFieldSelect,
+    "field/boolean": BooleanFieldSelect,
   }
 
   const getControl = type => {
diff --git a/packages/client/src/store/binding.js b/packages/client/src/store/binding.js
index b279142c32..e9ab28831d 100644
--- a/packages/client/src/store/binding.js
+++ b/packages/client/src/store/binding.js
@@ -3,7 +3,7 @@ import { writable } from "svelte/store"
 const createBindingStore = () => {
   const store = writable({})
 
-  const setBindableValue = (value, componentId) => {
+  const setBindableValue = (componentId, value) => {
     store.update(state => {
       if (componentId) {
         state[componentId] = value
diff --git a/packages/standard-components/manifest.json b/packages/standard-components/manifest.json
index ce628ee775..09af829621 100644
--- a/packages/standard-components/manifest.json
+++ b/packages/standard-components/manifest.json
@@ -1123,7 +1123,6 @@
   },
   "fieldgroup": {
     "name": "Field Group",
-    "description": "A group of fields in a form.",
     "icon": "ri-edit-box-line",
     "styleable": true,
     "hasChildren": true,
@@ -1152,7 +1151,6 @@
   },
   "stringfield": {
     "name": "Text Field",
-    "description": "A textfield component that allows the user to input text.",
     "icon": "ri-edit-box-line",
     "styleable": true,
     "bindable": true,
@@ -1176,7 +1174,6 @@
   },
   "numberfield": {
     "name": "Number Field",
-    "description": "A textfield component that allows the user to input numbers.",
     "icon": "ri-edit-box-line",
     "styleable": true,
     "bindable": true,
@@ -1200,7 +1197,6 @@
   },
   "optionsfield": {
     "name": "Options Picker",
-    "description": "A textfield component that allows the user to input text.",
     "icon": "ri-edit-box-line",
     "styleable": true,
     "bindable": true,
@@ -1222,5 +1218,28 @@
         "placeholder": "Choose an option"
       }
     ]
+  },
+  "booleanfield": {
+    "name": "Checkbox",
+    "icon": "ri-edit-box-line",
+    "styleable": true,
+    "bindable": true,
+    "settings": [
+      {
+        "type": "field/boolean",
+        "label": "Field",
+        "key": "field"
+      },
+      {
+        "type": "text",
+        "label": "Label",
+        "key": "label"
+      },
+      {
+        "type": "text",
+        "label": "Text",
+        "key": "text"
+      }
+    ]
   }
 }
diff --git a/packages/standard-components/package.json b/packages/standard-components/package.json
index 30d2c35346..678e772c0f 100644
--- a/packages/standard-components/package.json
+++ b/packages/standard-components/package.json
@@ -44,6 +44,7 @@
     "@budibase/svelte-ag-grid": "^0.0.16",
     "@spectrum-css/actionbutton": "^1.0.0-beta.1",
     "@spectrum-css/button": "^3.0.0-beta.6",
+    "@spectrum-css/checkbox": "^3.0.0-beta.6",
     "@spectrum-css/fieldlabel": "^3.0.0-beta.7",
     "@spectrum-css/icon": "^3.0.0-beta.2",
     "@spectrum-css/menu": "^3.0.0-beta.5",
diff --git a/packages/standard-components/src/DatePicker.svelte b/packages/standard-components/src/DatePicker.svelte
index 77b98b670b..200a563516 100644
--- a/packages/standard-components/src/DatePicker.svelte
+++ b/packages/standard-components/src/DatePicker.svelte
@@ -8,7 +8,7 @@
   export let placeholder
 
   let value
-  $: setBindableValue(value, $component.id)
+  $: setBindableValue($component.id, value)
 
   function handleChange(event) {
     const [fullDate] = event.detail
diff --git a/packages/standard-components/src/Input.svelte b/packages/standard-components/src/Input.svelte
index 18a8880529..03dd6ea023 100644
--- a/packages/standard-components/src/Input.svelte
+++ b/packages/standard-components/src/Input.svelte
@@ -7,7 +7,7 @@
   let value
 
   function onBlur() {
-    setBindableValue(value, $component.id)
+    setBindableValue($component.id, value)
   }
 </script>
 
diff --git a/packages/standard-components/src/forms/BooleanField.svelte b/packages/standard-components/src/forms/BooleanField.svelte
new file mode 100644
index 0000000000..4292eedcbe
--- /dev/null
+++ b/packages/standard-components/src/forms/BooleanField.svelte
@@ -0,0 +1,50 @@
+<script>
+  import { onMount } from "svelte"
+  import "@spectrum-css/checkbox/dist/index-vars.css"
+  import SpectrumField from "./SpectrumField.svelte"
+
+  export let field
+  export let label
+  export let text
+
+  let fieldState
+  let fieldApi
+
+  const onChange = event => {
+    fieldApi.setValue(event.target.checked)
+  }
+
+  // Ensure a valid boolean value is set
+  onMount(() => {
+    fieldApi.setValue($fieldState.value || false)
+  })
+</script>
+
+<SpectrumField {label} {field} bind:fieldState bind:fieldApi>
+  {#if fieldState}
+    <div class="spectrum-FieldGroup spectrum-FieldGroup--horizontal">
+      <label class="spectrum-Checkbox" class:is-invalid={!$fieldState.valid}>
+        <input
+          on:change={onChange}
+          type="checkbox"
+          class="spectrum-Checkbox-input"
+          id={$fieldState.fieldId} />
+        <span class="spectrum-Checkbox-box">
+          <svg
+            class="spectrum-Icon spectrum-UIIcon-Checkmark75 spectrum-Checkbox-checkmark"
+            focusable="false"
+            aria-hidden="true">
+            <use xlink:href="#spectrum-css-icon-Checkmark75" />
+          </svg>
+          <svg
+            class="spectrum-Icon spectrum-UIIcon-Dash75 spectrum-Checkbox-partialCheckmark"
+            focusable="false"
+            aria-hidden="true">
+            <use xlink:href="#spectrum-css-icon-Dash75" />
+          </svg>
+        </span>
+        <span class="spectrum-Checkbox-label">{text || 'Checkbox'}</span>
+      </label>
+    </div>
+  {/if}
+</SpectrumField>
diff --git a/packages/standard-components/src/forms/Form.svelte b/packages/standard-components/src/forms/Form.svelte
index 268b3f8aed..48684f4cfd 100644
--- a/packages/standard-components/src/forms/Form.svelte
+++ b/packages/standard-components/src/forms/Form.svelte
@@ -16,15 +16,14 @@
   let table
   let fieldMap = {}
 
-  // Keep form state up to date with form fields
-  $: updateFormState(fieldMap)
-
   // Form state contains observable data about the form
   const formState = writable({ values: {}, errors: {}, valid: true })
+  $: updateFormState(fieldMap)
+  $: setBindableValue($component.id, $formState.values)
 
   // Form API contains functions to control the form
   const formApi = {
-    registerField: (field, componentId) => {
+    registerField: field => {
       if (!field) {
         return
       }
@@ -38,7 +37,7 @@
 
       fieldMap[field] = {
         fieldState: makeFieldState(field),
-        fieldApi: makeFieldApi(field, componentId, validate),
+        fieldApi: makeFieldApi(field, validate),
         fieldSchema: schema?.[field] ?? {},
       }
       fieldMap = fieldMap
@@ -53,8 +52,6 @@
   const makeFieldApi = (field, componentId, validate) => {
     return {
       setValue: value => {
-        console.log("setting " + componentId + " to " + value)
-        setBindableValue(value, componentId)
         const { fieldState } = fieldMap[field]
         fieldState.update(state => {
           state.value = value
diff --git a/packages/standard-components/src/forms/OptionsField.svelte b/packages/standard-components/src/forms/OptionsField.svelte
index bdfb1664cc..6ff204b175 100644
--- a/packages/standard-components/src/forms/OptionsField.svelte
+++ b/packages/standard-components/src/forms/OptionsField.svelte
@@ -54,7 +54,8 @@
     </button>
     <div
       class="spectrum-Popover spectrum-Popover--bottom spectrum-Picker-popover"
-      class:is-open={open}>
+      class:is-open={open}
+      style="z-index: 1;">
       <ul class="spectrum-Menu" role="listbox">
         <li
           class="spectrum-Menu-item"
diff --git a/packages/standard-components/src/forms/SpectrumField.svelte b/packages/standard-components/src/forms/SpectrumField.svelte
index 0c7b826f9f..dd144e8518 100644
--- a/packages/standard-components/src/forms/SpectrumField.svelte
+++ b/packages/standard-components/src/forms/SpectrumField.svelte
@@ -18,7 +18,7 @@
   // Register field with form
   const { formApi } = formContext || {}
   const labelPosition = fieldGroupContext?.labelPosition || "above"
-  const formField = formApi?.registerField(field, $component.id)
+  const formField = formApi?.registerField(field)
 
   // Expose field properties to parent component
   fieldState = formField?.fieldState
@@ -37,13 +37,11 @@
 {:else}
   <FieldGroupFallback>
     <div class="spectrum-Form-item" use:styleable={$component.styles}>
-      {#if label}
-        <label
-          for={$fieldState.fieldId}
-          class={`spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-Form-itemLabel ${labelPositionClass}`}>
-          {label}
-        </label>
-      {/if}
+      <label
+        for={$fieldState.fieldId}
+        class={`spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-Form-itemLabel ${labelPositionClass}`}>
+        {label || ''}
+      </label>
       <div class="spectrum-Form-itemField">
         <slot />
         {#if $fieldState.error}
diff --git a/packages/standard-components/src/forms/index.js b/packages/standard-components/src/forms/index.js
index 166bd6cd72..52b7386005 100644
--- a/packages/standard-components/src/forms/index.js
+++ b/packages/standard-components/src/forms/index.js
@@ -3,3 +3,4 @@ export { default as fieldgroup } from "./FieldGroup.svelte"
 export { default as stringfield } from "./StringField.svelte"
 export { default as numberfield } from "./NumberField.svelte"
 export { default as optionsfield } from "./OptionsField.svelte"
+export { default as booleanfield } from "./BooleanField.svelte"
diff --git a/packages/standard-components/yarn.lock b/packages/standard-components/yarn.lock
index a1a4a11af5..4002f824cc 100644
--- a/packages/standard-components/yarn.lock
+++ b/packages/standard-components/yarn.lock
@@ -142,6 +142,11 @@
   resolved "https://registry.yarnpkg.com/@spectrum-css/button/-/button-3.0.0-beta.6.tgz#007919d3e7a6692e506dc9addcd46aee6b203b1a"
   integrity sha512-ZoJxezt5Pc006RR7SMG7PfC0VAdWqaGDpd21N8SEykGuz/KmNulqGW8RiSZQGMVX/jk5ZCAthPrH8cI/qtKbMg==
 
+"@spectrum-css/checkbox@^3.0.0-beta.6":
+  version "3.0.0-beta.6"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/checkbox/-/checkbox-3.0.0-beta.6.tgz#338c4e58c4570ac8023f7332794fcb45f5ae9374"
+  integrity sha512-Z0Mwu7yn2b+QcZaBqMpKhliTQiF8T/cRyKgTyaIACtJ0FAK5NBJ4h/X6SWW3iXtoUWCH4+p/Hdtq1iQHAFi1qQ==
+
 "@spectrum-css/fieldlabel@^3.0.0-beta.7":
   version "3.0.0-beta.7"
   resolved "https://registry.yarnpkg.com/@spectrum-css/fieldlabel/-/fieldlabel-3.0.0-beta.7.tgz#f37797565e21b3609b8fbc2dafcea8ea41ffa114"