diff --git a/src/components/form-checkbox/README.md b/src/components/form-checkbox/README.md
index e0cdc3724c3..5aee91c48e5 100644
--- a/src/components/form-checkbox/README.md
+++ b/src/components/form-checkbox/README.md
@@ -477,14 +477,14 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` (or `false`) is great for when there's a blocking or required field. A user must fill
-  in this field properly to submit the form.
-- `'valid'` (or `true`) is ideal for situations when you have per-field validation throughout a form
-  and want to encourage a user through the rest of the fields.
-- `null` Displays no validation state
-
-To apply one of the contextual state icons on `<b-form-checkbox>`, set the `state` prop to
-`'invalid'` (or `false`), `'valid'` (or `true`), or `null`.
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
+
+To apply one of the contextual state icons on `<b-form-checkbox>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
 
 **Note:** Contextual states are **not** supported when in button mode.
 
diff --git a/src/components/form-checkbox/form-checkbox.spec.js b/src/components/form-checkbox/form-checkbox.spec.js
index 38e1fb4dafa..983090e4452 100644
--- a/src/components/form-checkbox/form-checkbox.spec.js
+++ b/src/components/form-checkbox/form-checkbox.spec.js
@@ -364,24 +364,6 @@ describe('form-checkbox', () => {
     wrapper.destroy()
   })
 
-  it('default has input validation class is-valid when state="valid"', async () => {
-    const wrapper = mount(BFormCheckbox, {
-      propsData: {
-        state: 'valid',
-        checked: false
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).not.toContain('is-invalid')
-    expect(input.classes()).toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   it('default has input validation class is-invalid when state=false', async () => {
     const wrapper = mount(BFormCheckbox, {
       propsData: {
@@ -400,24 +382,6 @@ describe('form-checkbox', () => {
     wrapper.destroy()
   })
 
-  it('default has input validation class is-invalid when state="invalid"', async () => {
-    const wrapper = mount(BFormCheckbox, {
-      propsData: {
-        state: 'invalid',
-        checked: false
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).toContain('is-invalid')
-    expect(input.classes()).not.toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   // --- Plain styling ---
 
   it('plain has structure <div><input><label></label></div>', async () => {
@@ -610,25 +574,6 @@ describe('form-checkbox', () => {
     wrapper.destroy()
   })
 
-  it('plain has input validation class is-valid when state="valid"', async () => {
-    const wrapper = mount(BFormCheckbox, {
-      propsData: {
-        state: 'valid',
-        plain: true,
-        checked: false
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).not.toContain('is-invalid')
-    expect(input.classes()).toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   it('plain has input validation class is-invalid when state=false', async () => {
     const wrapper = mount(BFormCheckbox, {
       propsData: {
@@ -648,25 +593,6 @@ describe('form-checkbox', () => {
     wrapper.destroy()
   })
 
-  it('plain has input validation class is-invalid when state="invalid"', async () => {
-    const wrapper = mount(BFormCheckbox, {
-      propsData: {
-        state: 'invalid',
-        plain: true,
-        checked: false
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).toContain('is-invalid')
-    expect(input.classes()).not.toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   // --- Switch styling - stand alone ---
 
   it('switch has structure <div><input><label></label></div>', async () => {
diff --git a/src/components/form-file/README.md b/src/components/form-file/README.md
index d913ce147b4..6a5c02b7e25 100644
--- a/src/components/form-file/README.md
+++ b/src/components/form-file/README.md
@@ -224,14 +224,16 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` is great for when there's a blocking or required field. A user must fill in this field
-  properly to submit the form.
-- `'valid'` is ideal for situations when you have per-field validation throughout a form and want to
-  encourage a user through the rest of the fields.
-- `null` Displays no validation state
-
-To apply one of the contextual state icons on `<b-form-file`, set the `state` prop to `'invalid'`
-(or `false`), `'valid'` ( or `true`), or `null`.
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
+
+To apply one of the contextual state icons on `<b-form-file>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
+
+**Note:** Contextual states are **not** supported when in button mode.
 
 ## Autofocus
 
diff --git a/src/components/form-group/README.md b/src/components/form-group/README.md
index c97bd136d32..c3fae9da609 100644
--- a/src/components/form-group/README.md
+++ b/src/components/form-group/README.md
@@ -236,15 +236,14 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` is great for when there's a blocking or required field. A user must fill in this field
-  properly to submit the form.
-- `'valid'` is ideal for situations when you have per-field validation throughout a form and want to
-  encourage a user through the rest of the fields.
-- `null` Displays no validation state
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
 
-To apply one of the contextual states on `<b-form-group>`, set the `state` prop to `'invalid'` (or
-`false`), `'valid'` (or `true`), or `null`. This will programmatically show the appropriate feedback
-text.
+To apply one of the contextual state icons on `<b-form-group>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
 
 Bootstrap v4 uses sibling CSS selectors of `:invalid` or `:valid` inputs to show the feedback text.
 Some form controls (such as checkboxes, radios, and file inputs, or inputs inside input-groups) are
@@ -269,8 +268,6 @@ setting the prop `invalid-feedback` or using the named slot `invalid-feedback`.
 Invalid feedback is rendered using the
 [`<b-form-invalid-feedback>`](/docs/components/form#helper-components) form sub-component.
 
-**Note:** The prop `feedback` has been deprecated in favor of the `invalid-feedback` prop.
-
 ### Valid feedback
 
 Show optional valid state feedback text to provide textual state feedback (html supported) by
diff --git a/src/components/form-input/README.md b/src/components/form-input/README.md
index e8487c79acb..c5a7f474d20 100644
--- a/src/components/form-input/README.md
+++ b/src/components/form-input/README.md
@@ -208,17 +208,14 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` (or `false`) is great for when there's a blocking or required field. A user must fill
-  in this field properly to submit the form.
-- `'valid'` (or `true`) is ideal for situations when you have per-field validation throughout a form
-  and want to encourage a user through the rest of the fields.
-- `null` Displays no validation state
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
 
-To apply one of the contextual state icons on `<b-form-input>`, set the `state` prop to:
-
-- The string `'invalid'` or boolean `false` for invalid contextual state
-- The string `'valid'` or boolean `true` for the valid contextual state
-- `null` for no validation contextual state (default)
+To apply one of the contextual state icons on `<b-form-input>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
 
 ```html
 <b-container fluid>
@@ -314,16 +311,16 @@ text block.
 Specifically for assistive technologies, invalid form controls can also be assigned an
 `aria-invalid="true"` attribute.
 
-When `<b-form-input>` has an invalid contextual state (i.e. `'invalid'` or `false`) you may also
-want to set the `<b-form-input>` prop `aria-invalid` to `true`, or to one of the supported values:
+When `<b-form-input>` has an invalid contextual state (i.e. state is `false`) you may also want
+to set the `<b-form-input>` prop `aria-invalid` to `true`, or to one of the supported values:
 
 - `false`: Convey no errors detected (default)
 - `true` (or `'true'`): Convey that the value has failed validation.
 - `'grammar'` Convey that a grammatical error has been detected.
 - `'spelling'` Convey that a spelling error has been detected.
 
-If `aria-invalid` is not explicitly set and `state` is set to `false` (or `'invalid'`), then the
-`aria-invalid` attribute on the input will automatically be set to `'true'`;
+If `aria-invalid` is not explicitly set and `state` is set to `false`, then the `aria-invalid`
+attribute on the input will automatically be set to `'true'`;
 
 ## Formatter support
 
diff --git a/src/components/form-input/form-input.spec.js b/src/components/form-input/form-input.spec.js
index 5a7b9ee45c8..506df8c7796 100644
--- a/src/components/form-input/form-input.spec.js
+++ b/src/components/form-input/form-input.spec.js
@@ -230,19 +230,6 @@ describe('form-input', () => {
     wrapper.destroy()
   })
 
-  it('does not have is-valid or is-invalid classes when state=""', async () => {
-    const wrapper = mount(BFormInput, {
-      propsData: {
-        state: ''
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input.classes()).not.toContain('is-valid')
-    expect(input.classes()).not.toContain('is-invalid')
-
-    wrapper.destroy()
-  })
-
   it('has class is-valid when state=true', async () => {
     const wrapper = mount(BFormInput, {
       propsData: {
@@ -256,19 +243,6 @@ describe('form-input', () => {
     wrapper.destroy()
   })
 
-  it('has class is-valid when state="valid"', async () => {
-    const wrapper = mount(BFormInput, {
-      propsData: {
-        state: 'valid'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input.classes()).toContain('is-valid')
-    expect(input.classes()).not.toContain('is-invalid')
-
-    wrapper.destroy()
-  })
-
   it('has class is-invalid when state=false', async () => {
     const wrapper = mount(BFormInput, {
       propsData: {
@@ -282,19 +256,6 @@ describe('form-input', () => {
     wrapper.destroy()
   })
 
-  it('has class is-invalid when state="invalid"', async () => {
-    const wrapper = mount(BFormInput, {
-      propsData: {
-        state: 'invalid'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input.classes()).toContain('is-invalid')
-    expect(input.classes()).not.toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   it('does not have aria-invalid attribute by default', async () => {
     const wrapper = mount(BFormInput)
     expect(wrapper.contains('[aria-invalid]')).toBe(false)
diff --git a/src/components/form-radio/README.md b/src/components/form-radio/README.md
index d2d069324aa..952a29d61cf 100644
--- a/src/components/form-radio/README.md
+++ b/src/components/form-radio/README.md
@@ -358,14 +358,14 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` is great for when there's a blocking or required field. A user must fill in this field
-  properly to submit the form.
-- `'valid'` is ideal for situations when you have per-field validation throughout a form and want to
-  encourage a user through the rest of the fields.
-- `null` Displays no validation state
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
 
-To apply one of the contextual state icons on `<b-form-radio>`, set the `state` prop to `'invalid'`
-(or `false`), `'valid'` (or `true`), or `null`.
+To apply one of the contextual state icons on `<b-form-radio>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
 
 **Note:** Contextual state is not supported for radios rendered in buttons mode.
 
@@ -417,14 +417,14 @@ controls can also be assigned an `aria-invalid="true"` attribute (see below).
 
 ### ARIA `aria-invalid` attribute
 
-When `<b-form-radio-group>` has an invalid contextual state (i.e. `invalid`) you may also want to
-set the `<b-form-radio-group>` prop `aria-invalid` to `true`.
+When `<b-form-radio-group>` has an invalid contextual state (i.e. state = `false`) you may also want
+to set the `<b-form-radio-group>` prop `aria-invalid` to `true`.
 
 Supported `aria-invalid` values are:
 
 - `false` (default) No errors detected
 - `true` The value has failed validation.
 
-`aria-invalid` is automatically set to `true` if the `state` prop is `'invalid'` (or `false`).
+`aria-invalid` is automatically set to `true` if the `state` prop is `false`.
 
 <!-- Component reference added automatically from component package.json -->
diff --git a/src/components/form-radio/form-radio.spec.js b/src/components/form-radio/form-radio.spec.js
index 99e10bcc3d3..4c8d9adc4a5 100644
--- a/src/components/form-radio/form-radio.spec.js
+++ b/src/components/form-radio/form-radio.spec.js
@@ -350,25 +350,6 @@ describe('form-radio', () => {
     wrapper.destroy()
   })
 
-  it('default has input validation class is-valid when state="valid"', async () => {
-    const wrapper = mount(BFormRadio, {
-      propsData: {
-        state: 'valid',
-        checked: '',
-        value: 'a'
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).not.toContain('is-invalid')
-    expect(input.classes()).toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   it('default has input validation class is-invalid when state=false', async () => {
     const wrapper = mount(BFormRadio, {
       propsData: {
@@ -388,25 +369,6 @@ describe('form-radio', () => {
     wrapper.destroy()
   })
 
-  it('default has input validation class is-invalid when state="invalid"', async () => {
-    const wrapper = mount(BFormRadio, {
-      propsData: {
-        state: 'invalid',
-        checked: '',
-        value: 'a'
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).toContain('is-invalid')
-    expect(input.classes()).not.toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   // --- Plain styling ---
 
   it('plain has structure <div><input><label></label></div>', async () => {
@@ -577,26 +539,6 @@ describe('form-radio', () => {
     wrapper.destroy()
   })
 
-  it('plain has input validation class is-valid when state="valid"', async () => {
-    const wrapper = mount(BFormRadio, {
-      propsData: {
-        state: 'valid',
-        plain: true,
-        checked: '',
-        value: 'a'
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).not.toContain('is-invalid')
-    expect(input.classes()).toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   it('plain has input validation class is-invalid when state=false', async () => {
     const wrapper = mount(BFormRadio, {
       propsData: {
@@ -617,26 +559,6 @@ describe('form-radio', () => {
     wrapper.destroy()
   })
 
-  it('plain has input validation class is-invalid when state="invalid"', async () => {
-    const wrapper = mount(BFormRadio, {
-      propsData: {
-        state: 'invalid',
-        plain: true,
-        checked: '',
-        value: 'a'
-      },
-      slots: {
-        default: 'foobar'
-      }
-    })
-    const input = wrapper.find('input')
-    expect(input).toBeDefined()
-    expect(input.classes()).toContain('is-invalid')
-    expect(input.classes()).not.toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   // --- Button styling - stand-alone mode ---
 
   it('stand-alone button has structure <div><label><input></label></div>', async () => {
diff --git a/src/components/form-select/README.md b/src/components/form-select/README.md
index 77ecdbfb679..300d8b17bc8 100644
--- a/src/components/form-select/README.md
+++ b/src/components/form-select/README.md
@@ -383,14 +383,14 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` is great for when there's a blocking or required field. A user must fill in this field
-  properly to submit the form.
-- `'valid'` is ideal for situations when you have per-field validation throughout a form and want to
-  encourage a user through the rest of the fields.
-- `null` Displays no validation state
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
 
-To apply one of the contextual states on `<b-form-select>`, set the `state` prop to `'invalid'` (or
-`false`), `'valid'` (or `true`), or `null`.
+To apply one of the contextual state icons on `<b-form-select>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
 
 ### Conveying contextual validation state to assistive technologies and colorblind users
 
@@ -400,20 +400,20 @@ screen readers - or to colorblind users.
 
 Ensure that an alternative indication of state is also provided. For instance, you could include a
 hint about state in the form control's `<label>` text itself, or by providing an additional help
-text block (via `<b-form-group>` or `<b-form-feedback>`). Specifically for assistive technologies,
+text block (via `<b-form-group>` or `<b-form-*-feedback>`). Specifically for assistive technologies,
 invalid form controls can also be assigned an `aria-invalid="true"` attribute (see below).
 
 ### ARIA `aria-invalid` attribute:
 
-When `<b-form-select>` has an invalid contextual state (i.e. `invalid`) you may also want to set the
-`<b-form-select>` prop `aria-invalid` to `true`.
+When `<b-form-select>` has an invalid contextual state (i.e. state = `false`) you may also want to
+set the `<b-form-select>` prop `aria-invalid` to `true`.
 
 Supported `invalid` values are:
 
 - `false` (default) No errors detected
 - `true` The value has failed validation.
 
-When `state` is set to `invalid`, aria-invalid will also be set to true.
+When `state` is set to `false`, aria-invalid will also be set to true.
 
 ## Non custom select
 
diff --git a/src/components/form-select/form-select.spec.js b/src/components/form-select/form-select.spec.js
index 0ad5add4ec3..4ea90dfd21c 100644
--- a/src/components/form-select/form-select.spec.js
+++ b/src/components/form-select/form-select.spec.js
@@ -179,20 +179,6 @@ describe('form-select', () => {
     wrapper.destroy()
   })
 
-  it('has class is-invalid and attr aria-invalid="true" when state="invalid"', async () => {
-    const wrapper = mount(BFormSelect, {
-      propsData: {
-        state: 'invalid'
-      }
-    })
-    expect(wrapper.attributes('aria-invalid')).toBe('true')
-    expect(wrapper.classes()).toContain('is-invalid')
-    expect(wrapper.classes()).toContain('custom-select')
-    expect(wrapper.classes().length).toBe(2)
-
-    wrapper.destroy()
-  })
-
   it('has class is-valid when state=true', async () => {
     const wrapper = mount(BFormSelect, {
       propsData: {
@@ -207,20 +193,6 @@ describe('form-select', () => {
     wrapper.destroy()
   })
 
-  it('has class is-valid when state="valid"', async () => {
-    const wrapper = mount(BFormSelect, {
-      propsData: {
-        state: 'valid'
-      }
-    })
-    expect(wrapper.attributes('aria-invalid')).not.toBeDefined()
-    expect(wrapper.classes()).toContain('is-valid')
-    expect(wrapper.classes()).toContain('custom-select')
-    expect(wrapper.classes().length).toBe(2)
-
-    wrapper.destroy()
-  })
-
   it('has attr aria-invalid="true" when aria-invalid="true"', async () => {
     const wrapper = mount(BFormSelect, {
       propsData: {
diff --git a/src/components/form-textarea/README.md b/src/components/form-textarea/README.md
index ac82fbdba70..356849666ed 100644
--- a/src/components/form-textarea/README.md
+++ b/src/components/form-textarea/README.md
@@ -184,17 +184,14 @@ Bootstrap includes validation styles for `valid` and `invalid` states on most fo
 
 Generally speaking, you'll want to use a particular state for specific types of feedback:
 
-- `'invalid'` (or `false`) is great for when there's a blocking or required field. A user must fill
-  in this field properly to submit the form.
-- `'valid'` (or `true`) is ideal for situations when you have per-field validation throughout a form
-  and want to encourage a user through the rest of the fields.
-- `null` Displays no validation state
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
 
-To apply one of the contextual state icons on `<b-form-textarea>`, set the `state` prop to:
-
-- The string `'invalid'` or Boolean `false` to apply invalid styling
-- The string `'valid'` or Boolean `true` to apply valid styling
-- `null` for no validation contextual state
+To apply one of the contextual state icons on `<b-form-textarea>`, set the `state` prop to `false`
+(for invalid), `true` (for valid), or `null` (no validation state).
 
 ```html
 <template>
@@ -234,16 +231,16 @@ text block.
 
 ### `aria-invalid` attribute
 
-When `<b-form-textarea>` has an invalid contextual state (i.e. `'invalid'` or `false`) you may also
-want to set the prop `aria-invalid` to `true`, or one of the supported values:
+When `<b-form-textarea>` has an invalid contextual state (i.e. state is `false`) you may also want
+to set the prop `aria-invalid` to `true`, or one of the supported values:
 
 - `false`: No errors (default)
 - `true` or `'true'`: The value has failed validation.
 - `'grammar'`: A grammatical error has been detected.
 - `'spelling'` A spelling error has been detected.
 
-If the `state` prop is set to `false` (or `'invalid'`), and the `aria-invalid` prop is not
-explicitly set, `<b-form-textarea>` will automatically set the `aria-invalid` attribute to `'true'`.
+If the `state` prop is set to `false`, and the `aria-invalid` prop is not explicitly set,
+`<b-form-textarea>` will automatically set the `aria-invalid` attribute to `'true'`.
 
 ## Formatter support
 
diff --git a/src/components/form-textarea/form-textarea.spec.js b/src/components/form-textarea/form-textarea.spec.js
index 33885e64cd6..4b4a635508a 100644
--- a/src/components/form-textarea/form-textarea.spec.js
+++ b/src/components/form-textarea/form-textarea.spec.js
@@ -161,18 +161,6 @@ describe('form-textarea', () => {
     wrapper.destroy()
   })
 
-  it('has class is-valid when state=valid', async () => {
-    const wrapper = mount(BFormTextarea, {
-      propsData: {
-        state: 'valid'
-      }
-    })
-    expect(wrapper.classes()).toContain('is-valid')
-    expect(wrapper.classes()).not.toContain('is-invalid')
-
-    wrapper.destroy()
-  })
-
   it('has class is-invalid when state=false', async () => {
     const wrapper = mount(BFormTextarea, {
       propsData: {
@@ -185,18 +173,6 @@ describe('form-textarea', () => {
     wrapper.destroy()
   })
 
-  it('has class is-invalid when state=invalid', async () => {
-    const wrapper = mount(BFormTextarea, {
-      propsData: {
-        state: 'invalid'
-      }
-    })
-    expect(wrapper.classes()).toContain('is-invalid')
-    expect(wrapper.classes()).not.toContain('is-valid')
-
-    wrapper.destroy()
-  })
-
   it('does not have aria-invalid attribute by default', async () => {
     const wrapper = mount(BFormTextarea)
     expect(wrapper.contains('[aria-invalid]')).toBe(false)
@@ -215,17 +191,6 @@ describe('form-textarea', () => {
     wrapper.destroy()
   })
 
-  it('does not have aria-invalid attribute when state=valid', async () => {
-    const wrapper = mount(BFormTextarea, {
-      propsData: {
-        state: 'valid'
-      }
-    })
-    expect(wrapper.contains('[aria-invalid]')).toBe(false)
-
-    wrapper.destroy()
-  })
-
   it('has aria-invalid attribute when state=false', async () => {
     const input = mount(BFormTextarea, {
       propsData: {
@@ -237,17 +202,6 @@ describe('form-textarea', () => {
     input.destroy()
   })
 
-  it('has aria-invalid attribute when state=invalid', async () => {
-    const input = mount(BFormTextarea, {
-      propsData: {
-        state: 'invalid'
-      }
-    })
-    expect(input.attributes('aria-invalid')).toBe('true')
-
-    input.destroy()
-  })
-
   it('has aria-invalid attribute when aria-invalid=true', async () => {
     const input = mount(BFormTextarea, {
       propsData: {
diff --git a/src/components/form/README.md b/src/components/form/README.md
index afdce570ffd..af7c8ccb361 100644
--- a/src/components/form/README.md
+++ b/src/components/form/README.md
@@ -335,12 +335,12 @@ the form to trigger validation states
 All of the form controls support a `state` prop, which can be used to set the form control into one
 of three contextual states:
 
-- Setting `state` to `false` (or the string `'invalid'`) is great for when there's a blocking or
-  required field. A user must fill in this field properly to submit the form.
-- Setting `state` to `true` (or the string `'valid'`) is ideal for situations when you have
-  per-field validation throughout a form and want to encourage a user through the rest of the
-  fields.
-- Setting `state` to `null` Displays no validation state.
+- `false` (denotes invalid state) is great for when there's a blocking or required field. A user
+  must fill in this field properly to submit the form.
+- `true` (denotes valid state) is ideal for situations when you have per-field validation
+  throughout a form and want to encourage a user through the rest of the fields.
+- `null` Displays no validation state (neither valid nor invalid)
+
 
 Refer to the
 [Bootstrap v4 Form Validation Documentation](https://getbootstrap.com/docs/4.3/components/forms/#validation)
diff --git a/src/mixins/form-state.js b/src/mixins/form-state.js
index 281e354c6dd..db458175e98 100644
--- a/src/mixins/form-state.js
+++ b/src/mixins/form-state.js
@@ -2,32 +2,25 @@
  *
  * Returned class is either 'is-valid' or 'is-invalid' based on the 'state' prop
  * state can be one of five values:
- *  - true or 'valid' for is-valid
- *  - false or 'invalid' for is-invalid
- *  - null (or empty string) for no contextual state
+ *  - true for is-valid
+ *  - false for is-invalid
+ *  - null for no contextual state
  */
+import { isBoolean } from '../utils/inspect'
 
 // @vue/component
 export default {
   props: {
     state: {
-      // true/'valid', false/'invalid', '',null
-      // The order must be String first, then Boolean!
-      type: [String, Boolean],
+      // Tri-state prop: true, false, null (or undefined)
+      type: Boolean,
       default: null
     }
   },
   computed: {
     computedState() {
-      const state = this.state
-      if (state === '') {
-        return null
-      } else if (state === true || state === 'valid') {
-        return true
-      } else if (state === false || state === 'invalid') {
-        return false
-      }
-      return null
+      // If not a boolean, ensure that value is null
+      return isBoolean(this.state) ? this.state : null
     },
     stateClass() {
       const state = this.computedState