diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts
index 5bf2ae40d5..d8d691efd6 100755
--- a/components/lib/autocomplete/AutoComplete.d.ts
+++ b/components/lib/autocomplete/AutoComplete.d.ts
@@ -350,6 +350,11 @@ export interface AutoCompleteProps {
      * @defaultValue false
      */
     loading?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/autocomplete/BaseAutoComplete.vue b/components/lib/autocomplete/BaseAutoComplete.vue
index df9b9e647c..c2ea6414a2 100644
--- a/components/lib/autocomplete/BaseAutoComplete.vue
+++ b/components/lib/autocomplete/BaseAutoComplete.vue
@@ -45,6 +45,10 @@ export default {
             type: Boolean,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/autocomplete/style/AutoCompleteStyle.js b/components/lib/autocomplete/style/AutoCompleteStyle.js
index ba06e76c95..d92d31ef29 100644
--- a/components/lib/autocomplete/style/AutoCompleteStyle.js
+++ b/components/lib/autocomplete/style/AutoCompleteStyle.js
@@ -110,6 +110,7 @@ const classes = {
         'p-autocomplete p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-autocomplete-dd': props.dropdown,
             'p-autocomplete-multiple': props.multiple,
diff --git a/components/lib/calendar/BaseCalendar.vue b/components/lib/calendar/BaseCalendar.vue
index 2d3a58fa81..ac1b8d90b9 100644
--- a/components/lib/calendar/BaseCalendar.vue
+++ b/components/lib/calendar/BaseCalendar.vue
@@ -176,6 +176,10 @@ export default {
             type: [String, Object],
             default: 'body'
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
index c7eb934213..9b8540d985 100755
--- a/components/lib/calendar/Calendar.d.ts
+++ b/components/lib/calendar/Calendar.d.ts
@@ -711,6 +711,11 @@ export interface CalendarProps {
      * @defaultValue true
      */
     manualInput?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/calendar/style/CalendarStyle.js b/components/lib/calendar/style/CalendarStyle.js
index f3d64eb9c1..c354ff993b 100644
--- a/components/lib/calendar/style/CalendarStyle.js
+++ b/components/lib/calendar/style/CalendarStyle.js
@@ -166,6 +166,7 @@ const classes = {
             'p-input-icon-right': props.showIcon && props.iconDisplay === 'input',
             'p-calendar-timeonly': props.timeOnly,
             'p-calendar-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-inputwrapper-filled': props.modelValue,
             'p-inputwrapper-focus': state.focused,
             'p-focus': state.focused || state.overlayVisible
diff --git a/components/lib/cascadeselect/BaseCascadeSelect.vue b/components/lib/cascadeselect/BaseCascadeSelect.vue
index abd4f72e71..dbc69654cf 100644
--- a/components/lib/cascadeselect/BaseCascadeSelect.vue
+++ b/components/lib/cascadeselect/BaseCascadeSelect.vue
@@ -14,6 +14,10 @@ export default {
         optionGroupLabel: null,
         optionGroupChildren: null,
         placeholder: String,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: Boolean,
         dataKey: null,
         inputId: {
diff --git a/components/lib/cascadeselect/CascadeSelect.d.ts b/components/lib/cascadeselect/CascadeSelect.d.ts
index c7d1ee9e34..3e5a6e2bc0 100644
--- a/components/lib/cascadeselect/CascadeSelect.d.ts
+++ b/components/lib/cascadeselect/CascadeSelect.d.ts
@@ -271,6 +271,11 @@ export interface CascadeSelectProps {
      * Default text to display when no option is selected.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/cascadeselect/style/CascadeSelectStyle.js b/components/lib/cascadeselect/style/CascadeSelectStyle.js
index a37c71f732..85f54f3b0e 100644
--- a/components/lib/cascadeselect/style/CascadeSelectStyle.js
+++ b/components/lib/cascadeselect/style/CascadeSelectStyle.js
@@ -103,6 +103,7 @@ const classes = {
         'p-cascadeselect p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': props.modelValue,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
diff --git a/components/lib/checkbox/BaseCheckbox.vue b/components/lib/checkbox/BaseCheckbox.vue
index 939f7a9af1..fb434f62f1 100644
--- a/components/lib/checkbox/BaseCheckbox.vue
+++ b/components/lib/checkbox/BaseCheckbox.vue
@@ -21,6 +21,10 @@ export default {
             type: null,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/checkbox/Checkbox.d.ts b/components/lib/checkbox/Checkbox.d.ts
index 69cd7707d0..d513b1e912 100755
--- a/components/lib/checkbox/Checkbox.d.ts
+++ b/components/lib/checkbox/Checkbox.d.ts
@@ -111,6 +111,11 @@ export interface CheckboxProps {
      * @default false
      */
     binary?: boolean;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the element should be disabled.
      * @default false
diff --git a/components/lib/checkbox/style/CheckboxStyle.js b/components/lib/checkbox/style/CheckboxStyle.js
index 45cae0f8bd..b720000b0b 100644
--- a/components/lib/checkbox/style/CheckboxStyle.js
+++ b/components/lib/checkbox/style/CheckboxStyle.js
@@ -26,7 +26,8 @@ const classes = {
         'p-checkbox p-component',
         {
             'p-highlight': instance.checked,
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     box: 'p-checkbox-box',
diff --git a/components/lib/chips/BaseChips.vue b/components/lib/chips/BaseChips.vue
index 979732c0c7..4a2fd9f6c2 100644
--- a/components/lib/chips/BaseChips.vue
+++ b/components/lib/chips/BaseChips.vue
@@ -30,6 +30,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/chips/Chips.d.ts b/components/lib/chips/Chips.d.ts
index 8b13886185..cd951fe260 100755
--- a/components/lib/chips/Chips.d.ts
+++ b/components/lib/chips/Chips.d.ts
@@ -184,8 +184,14 @@ export interface ChipsProps {
      * @deprecated since v3.27.0. Use 'removetokenicon' slot.
      */
     removeTokenIcon?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the element should be disabled.
+     * @defaultValue false
      */
     disabled?: boolean | undefined;
     /**
diff --git a/components/lib/chips/style/ChipsStyle.js b/components/lib/chips/style/ChipsStyle.js
index aed5a95547..1c7cfdab2c 100644
--- a/components/lib/chips/style/ChipsStyle.js
+++ b/components/lib/chips/style/ChipsStyle.js
@@ -55,6 +55,7 @@ const classes = {
         'p-chips p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': (props.modelValue && props.modelValue.length) || (instance.inputValue && instance.inputValue.length),
             'p-inputwrapper-focus': instance.focused
diff --git a/components/lib/dropdown/BaseDropdown.vue b/components/lib/dropdown/BaseDropdown.vue
index 5e2a541b0d..5499fef1d6 100644
--- a/components/lib/dropdown/BaseDropdown.vue
+++ b/components/lib/dropdown/BaseDropdown.vue
@@ -33,6 +33,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/dropdown/Dropdown.d.ts b/components/lib/dropdown/Dropdown.d.ts
index 1f1fba8cb0..53ff934606 100755
--- a/components/lib/dropdown/Dropdown.d.ts
+++ b/components/lib/dropdown/Dropdown.d.ts
@@ -319,6 +319,11 @@ export interface DropdownProps {
      * Default text to display when no option is selected.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/dropdown/style/DropdownStyle.js b/components/lib/dropdown/style/DropdownStyle.js
index ddcbb15045..7857cd7e5d 100644
--- a/components/lib/dropdown/style/DropdownStyle.js
+++ b/components/lib/dropdown/style/DropdownStyle.js
@@ -104,6 +104,7 @@ const classes = {
         'p-dropdown p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-dropdown-clearable': props.showClear,
             'p-focus': state.focused,
             'p-inputwrapper-filled': instance.hasSelectedOption,
diff --git a/components/lib/inputnumber/BaseInputNumber.vue b/components/lib/inputnumber/BaseInputNumber.vue
index d0f49ea066..b78bf4fd13 100644
--- a/components/lib/inputnumber/BaseInputNumber.vue
+++ b/components/lib/inputnumber/BaseInputNumber.vue
@@ -109,6 +109,10 @@ export default {
             type: Boolean,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/inputnumber/InputNumber.d.ts b/components/lib/inputnumber/InputNumber.d.ts
index 360ca273c4..c96e26685c 100755
--- a/components/lib/inputnumber/InputNumber.d.ts
+++ b/components/lib/inputnumber/InputNumber.d.ts
@@ -262,6 +262,11 @@ export interface InputNumberProps {
      * @defaultValue false
      */
     highlightOnFocus?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/inputnumber/style/InputNumberStyle.js b/components/lib/inputnumber/style/InputNumberStyle.js
index 59b03a32bc..4a88f544a5 100644
--- a/components/lib/inputnumber/style/InputNumberStyle.js
+++ b/components/lib/inputnumber/style/InputNumberStyle.js
@@ -113,7 +113,8 @@ const classes = {
             'p-inputwrapper-focus': instance.focused,
             'p-inputnumber-buttons-stacked': props.showButtons && props.buttonLayout === 'stacked',
             'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',
-            'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical'
+            'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical',
+            'p-invalid': props.invalid
         }
     ],
     input: 'p-inputnumber-input',
diff --git a/components/lib/inputswitch/BaseInputSwitch.vue b/components/lib/inputswitch/BaseInputSwitch.vue
index 86badafc53..e259fee89f 100644
--- a/components/lib/inputswitch/BaseInputSwitch.vue
+++ b/components/lib/inputswitch/BaseInputSwitch.vue
@@ -18,6 +18,10 @@ export default {
             type: null,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/inputswitch/InputSwitch.d.ts b/components/lib/inputswitch/InputSwitch.d.ts
index 468c4e3796..8f0a2643c2 100755
--- a/components/lib/inputswitch/InputSwitch.d.ts
+++ b/components/lib/inputswitch/InputSwitch.d.ts
@@ -105,6 +105,11 @@ export interface InputSwitchProps {
      * @defaultValue false
      */
     falseValue?: any;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/inputswitch/style/InputSwitchStyle.js b/components/lib/inputswitch/style/InputSwitchStyle.js
index a14ec62ba4..7206787cd5 100644
--- a/components/lib/inputswitch/style/InputSwitchStyle.js
+++ b/components/lib/inputswitch/style/InputSwitchStyle.js
@@ -37,7 +37,8 @@ const classes = {
         'p-inputswitch p-component',
         {
             'p-highlight': instance.checked,
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     input: 'p-inputswitch-input',
diff --git a/components/lib/inputtext/BaseInputText.vue b/components/lib/inputtext/BaseInputText.vue
index d3cf25e52d..2615f2860a 100644
--- a/components/lib/inputtext/BaseInputText.vue
+++ b/components/lib/inputtext/BaseInputText.vue
@@ -10,6 +10,10 @@ export default {
         size: {
             type: String,
             default: null
+        },
+        invalid: {
+            type: Boolean,
+            default: false
         }
     },
     style: InputTextStyle,
diff --git a/components/lib/inputtext/InputText.d.ts b/components/lib/inputtext/InputText.d.ts
index bbd729cbfe..25eb76a328 100755
--- a/components/lib/inputtext/InputText.d.ts
+++ b/components/lib/inputtext/InputText.d.ts
@@ -91,6 +91,11 @@ export interface InputTextProps extends InputHTMLAttributes {
      * Defines the size of the component.
      */
     size?: 'small' | 'large' | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * Used to pass attributes to DOM elements inside the component.
      * @type {InputTextPassThroughOptions}
diff --git a/components/lib/inputtext/style/InputTextStyle.js b/components/lib/inputtext/style/InputTextStyle.js
index efb5fba3fe..a86b3baa8d 100644
--- a/components/lib/inputtext/style/InputTextStyle.js
+++ b/components/lib/inputtext/style/InputTextStyle.js
@@ -6,7 +6,8 @@ const classes = {
         {
             'p-filled': instance.filled,
             'p-inputtext-sm': props.size === 'small',
-            'p-inputtext-lg': props.size === 'large'
+            'p-inputtext-lg': props.size === 'large',
+            'p-invalid': props.invalid
         }
     ]
 };
diff --git a/components/lib/listbox/BaseListbox.vue b/components/lib/listbox/BaseListbox.vue
index 663133c919..f81b94bc6b 100644
--- a/components/lib/listbox/BaseListbox.vue
+++ b/components/lib/listbox/BaseListbox.vue
@@ -14,6 +14,10 @@ export default {
         optionGroupLabel: null,
         optionGroupChildren: null,
         listStyle: null,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/listbox/Listbox.d.ts b/components/lib/listbox/Listbox.d.ts
index cfefd63f3c..f58860b56c 100755
--- a/components/lib/listbox/Listbox.d.ts
+++ b/components/lib/listbox/Listbox.d.ts
@@ -240,6 +240,11 @@ export interface ListboxProps {
      * Inline style of inner list element.
      */
     listStyle?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When specified, disables the component.
      * @defaultValue false
diff --git a/components/lib/listbox/style/ListboxStyle.js b/components/lib/listbox/style/ListboxStyle.js
index 50d5ea4ac0..ffd6bf8bfc 100644
--- a/components/lib/listbox/style/ListboxStyle.js
+++ b/components/lib/listbox/style/ListboxStyle.js
@@ -42,7 +42,8 @@ const classes = {
     root: ({ instance, props }) => [
         'p-listbox p-component',
         {
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     header: 'p-listbox-header',
diff --git a/components/lib/multiselect/BaseMultiSelect.vue b/components/lib/multiselect/BaseMultiSelect.vue
index d7d2928d77..8dc2f30ae7 100644
--- a/components/lib/multiselect/BaseMultiSelect.vue
+++ b/components/lib/multiselect/BaseMultiSelect.vue
@@ -18,6 +18,10 @@ export default {
             default: '200px'
         },
         placeholder: String,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: Boolean,
         inputId: {
             type: String,
diff --git a/components/lib/multiselect/MultiSelect.d.ts b/components/lib/multiselect/MultiSelect.d.ts
index b9345c3edf..a30fa31d2e 100755
--- a/components/lib/multiselect/MultiSelect.d.ts
+++ b/components/lib/multiselect/MultiSelect.d.ts
@@ -331,6 +331,11 @@ export interface MultiSelectProps {
      * Label to display when there are no selections.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/multiselect/style/MultiSelectStyle.js b/components/lib/multiselect/style/MultiSelectStyle.js
index dee9bab70c..98ecb08fc1 100644
--- a/components/lib/multiselect/style/MultiSelectStyle.js
+++ b/components/lib/multiselect/style/MultiSelectStyle.js
@@ -120,6 +120,7 @@ const classes = {
         {
             'p-multiselect-chip': props.display === 'chip',
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': props.modelValue && props.modelValue.length,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
diff --git a/components/lib/password/BasePassword.vue b/components/lib/password/BasePassword.vue
index 99d55066fc..d5ecb6d97e 100644
--- a/components/lib/password/BasePassword.vue
+++ b/components/lib/password/BasePassword.vue
@@ -51,6 +51,10 @@ export default {
             type: String,
             default: undefined
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/password/Password.d.ts b/components/lib/password/Password.d.ts
index b0a806d4b5..90531ab47e 100755
--- a/components/lib/password/Password.d.ts
+++ b/components/lib/password/Password.d.ts
@@ -221,6 +221,11 @@ export interface PasswordProps extends InputHTMLAttributes {
      * @deprecated since v3.27.0. Use 'showicon' slot.
      */
     showIcon?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/password/style/PasswordStyle.js b/components/lib/password/style/PasswordStyle.js
index b1df8398ba..b2138697b3 100644
--- a/components/lib/password/style/PasswordStyle.js
+++ b/components/lib/password/style/PasswordStyle.js
@@ -41,7 +41,8 @@ const classes = {
         {
             'p-inputwrapper-filled': instance.filled,
             'p-inputwrapper-focus': instance.focused,
-            'p-input-icon-right': props.toggleMask
+            'p-input-icon-right': props.toggleMask,
+            'p-invalid': props.invalid
         }
     ],
     input: ({ props }) => [
diff --git a/components/lib/radiobutton/BaseRadioButton.vue b/components/lib/radiobutton/BaseRadioButton.vue
index 843ce98e77..378c172b50 100644
--- a/components/lib/radiobutton/BaseRadioButton.vue
+++ b/components/lib/radiobutton/BaseRadioButton.vue
@@ -13,6 +13,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/radiobutton/RadioButton.d.ts b/components/lib/radiobutton/RadioButton.d.ts
index 6cd9d20f86..6bc2fa0d32 100755
--- a/components/lib/radiobutton/RadioButton.d.ts
+++ b/components/lib/radiobutton/RadioButton.d.ts
@@ -110,6 +110,11 @@ export interface RadioButtonProps {
      * @default false
      */
     binary?: boolean;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/radiobutton/style/RadioButtonStyle.js b/components/lib/radiobutton/style/RadioButtonStyle.js
index 26642b3f8d..4b920ea05f 100644
--- a/components/lib/radiobutton/style/RadioButtonStyle.js
+++ b/components/lib/radiobutton/style/RadioButtonStyle.js
@@ -39,7 +39,8 @@ const classes = {
         'p-radiobutton p-component',
         {
             'p-highlight': instance.checked,
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     box: 'p-radiobutton-box',
diff --git a/components/lib/selectbutton/BaseSelectButton.vue b/components/lib/selectbutton/BaseSelectButton.vue
index b2b4648676..8af63441c2 100644
--- a/components/lib/selectbutton/BaseSelectButton.vue
+++ b/components/lib/selectbutton/BaseSelectButton.vue
@@ -20,6 +20,10 @@ export default {
             type: Boolean,
             default: true
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: Boolean,
         dataKey: null,
         ariaLabelledby: {
diff --git a/components/lib/selectbutton/SelectButton.d.ts b/components/lib/selectbutton/SelectButton.d.ts
index fdf67c0100..dbb281c719 100755
--- a/components/lib/selectbutton/SelectButton.d.ts
+++ b/components/lib/selectbutton/SelectButton.d.ts
@@ -153,6 +153,11 @@ export interface SelectButtonProps {
      * @defaultValue false
      */
     multiple?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the element should be disabled.
      * @defaultValue false
diff --git a/components/lib/selectbutton/style/SelectButtonStyle.js b/components/lib/selectbutton/style/SelectButtonStyle.js
index a02305a1ca..454cabd1e7 100644
--- a/components/lib/selectbutton/style/SelectButtonStyle.js
+++ b/components/lib/selectbutton/style/SelectButtonStyle.js
@@ -1,7 +1,13 @@
 import BaseStyle from 'primevue/base/style';
 
 const classes = {
-    root: ({ props }) => ['p-selectbutton p-buttonset p-component', { 'p-disabled': props.disabled }],
+    root: ({ props }) => [
+        'p-selectbutton p-buttonset p-component',
+        {
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
+        }
+    ],
     button: ({ instance, option }) => [
         'p-button p-component',
         {
diff --git a/components/lib/textarea/BaseTextarea.vue b/components/lib/textarea/BaseTextarea.vue
index 79fb83d061..3f39b3a2a6 100644
--- a/components/lib/textarea/BaseTextarea.vue
+++ b/components/lib/textarea/BaseTextarea.vue
@@ -7,7 +7,11 @@ export default {
     extends: BaseComponent,
     props: {
         modelValue: null,
-        autoResize: Boolean
+        autoResize: Boolean,
+        invalid: {
+            type: Boolean,
+            default: false
+        }
     },
     style: TextareaStyle,
     provide() {
diff --git a/components/lib/textarea/Textarea.d.ts b/components/lib/textarea/Textarea.d.ts
index d68e6bcd3c..492bdfd28f 100755
--- a/components/lib/textarea/Textarea.d.ts
+++ b/components/lib/textarea/Textarea.d.ts
@@ -97,6 +97,11 @@ export interface TextareaProps extends TextareaHTMLAttributes {
      * @defaultValue false
      */
     autoResize?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * Used to pass attributes to DOM elements inside the component.
      * @type {TextareaPassThroughOptions}
diff --git a/components/lib/textarea/style/TextareaStyle.js b/components/lib/textarea/style/TextareaStyle.js
index 046b672e2e..aa6e19a593 100644
--- a/components/lib/textarea/style/TextareaStyle.js
+++ b/components/lib/textarea/style/TextareaStyle.js
@@ -18,7 +18,8 @@ const classes = {
         'p-inputtextarea p-inputtext p-component',
         {
             'p-filled': instance.filled,
-            'p-inputtextarea-resizable ': props.autoResize
+            'p-inputtextarea-resizable ': props.autoResize,
+            'p-invalid': props.invalid
         }
     ]
 };
diff --git a/components/lib/togglebutton/BaseToggleButton.vue b/components/lib/togglebutton/BaseToggleButton.vue
index 3c683b2564..742ef22db4 100644
--- a/components/lib/togglebutton/BaseToggleButton.vue
+++ b/components/lib/togglebutton/BaseToggleButton.vue
@@ -21,6 +21,10 @@ export default {
             type: String,
             default: 'left'
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/togglebutton/ToggleButton.d.ts b/components/lib/togglebutton/ToggleButton.d.ts
index 62080a7daf..3a0139f24b 100755
--- a/components/lib/togglebutton/ToggleButton.d.ts
+++ b/components/lib/togglebutton/ToggleButton.d.ts
@@ -144,6 +144,11 @@ export interface ToggleButtonProps {
      * @defaultValue left
      */
     iconPos?: 'left' | 'right' | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the element should be disabled.
      * @defaultValue false
diff --git a/components/lib/togglebutton/style/ToggleButtonStyle.js b/components/lib/togglebutton/style/ToggleButtonStyle.js
index 1c4ed4e227..8b525426d3 100644
--- a/components/lib/togglebutton/style/ToggleButtonStyle.js
+++ b/components/lib/togglebutton/style/ToggleButtonStyle.js
@@ -24,7 +24,8 @@ const classes = {
         'p-togglebutton p-component',
         {
             'p-disabled': props.disabled,
-            'p-highlight': instance.active
+            'p-highlight': instance.active,
+            'p-invalid': props.invalid
         }
     ],
     input: 'p-togglebutton-input',
diff --git a/components/lib/treeselect/BaseTreeSelect.vue b/components/lib/treeselect/BaseTreeSelect.vue
index 92b2e3eedc..a9b125eb60 100644
--- a/components/lib/treeselect/BaseTreeSelect.vue
+++ b/components/lib/treeselect/BaseTreeSelect.vue
@@ -16,6 +16,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index 05d33ac5e9..c7c590717e 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -179,6 +179,11 @@ export interface TreeSelectProps {
      * Label to display when there are no selections.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/treeselect/style/TreeSelectStyle.js b/components/lib/treeselect/style/TreeSelectStyle.js
index b568c98a69..4e6b5ba14e 100644
--- a/components/lib/treeselect/style/TreeSelectStyle.js
+++ b/components/lib/treeselect/style/TreeSelectStyle.js
@@ -65,6 +65,7 @@ const classes = {
         {
             'p-treeselect-chip': props.display === 'chip',
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': !instance.emptyValue,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible
diff --git a/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue b/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue
index d1f7071bca..d880843cd6 100644
--- a/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue
+++ b/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue
@@ -7,6 +7,10 @@ export default {
     extends: BaseComponent,
     props: {
         modelValue: null,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false
diff --git a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
index a8768b36ca..083acd51b9 100755
--- a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
+++ b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
@@ -127,6 +127,11 @@ export interface TriStateCheckboxProps {
      * @defaultValue null
      */
     modelValue?: Nullable<boolean>;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false
diff --git a/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js b/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js
index 94fc8a8c65..597cb24e4f 100644
--- a/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js
+++ b/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js
@@ -26,7 +26,8 @@ const classes = {
         'p-tristatecheckbox p-checkbox p-component',
         {
             'p-highlight': instance.active,
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     box: 'p-checkbox-box',