diff --git a/packages/web-twig/src/Resources/components/Accordion/Accordion.twig b/packages/web-twig/src/Resources/components/Accordion/Accordion.twig
index 6c03b6c2cb..d78275feee 100644
--- a/packages/web-twig/src/Resources/components/Accordion/Accordion.twig
+++ b/packages/web-twig/src/Resources/components/Accordion/Accordion.twig
@@ -7,7 +7,7 @@
 {%- set _rootClassName = _spiritClassPrefix ~ 'Accordion' -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -17,7 +17,7 @@
 <{{ _elementType }}
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
-    {{ _idAttr }}
+    {{ _idAttr | raw }}
     {{ classProp(_classNames) }}
     data-toggle="accordion"
 >
diff --git a/packages/web-twig/src/Resources/components/Accordion/AccordionContent.twig b/packages/web-twig/src/Resources/components/Accordion/AccordionContent.twig
index 38a1654175..af106b5343 100644
--- a/packages/web-twig/src/Resources/components/Accordion/AccordionContent.twig
+++ b/packages/web-twig/src/Resources/components/Accordion/AccordionContent.twig
@@ -12,9 +12,9 @@
 {%- set _isOpenClassName = _isOpen ? 'is-open' : null -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
-{%- set _labelledIdAttr = _labelledById ? 'aria-labelledby=' ~ _labelledById : null -%}
-{%- set _dataParentAttr = _parent ? 'data-parent=' ~ _parent : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _labelledIdAttr = _labelledById ? 'aria-labelledby="' ~ _labelledById | escape('html_attr') ~ '"' : null -%}
+{%- set _dataParentAttr = _parent ? 'data-parent="' ~ _parent | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -25,10 +25,10 @@
 <div
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
-    {{ _idAttr }}
+    {{ _idAttr | raw }}
     {{ classProp(_collapseClassNames) }}
-    {{ _labelledIdAttr }}
-    {{ _dataParentAttr }}
+    {{ _labelledIdAttr | raw }}
+    {{ _dataParentAttr | raw }}
 >
     <div class="{{ _collapseClassName }}">
         <div {{ classProp(_contentClassNames) }}>
diff --git a/packages/web-twig/src/Resources/components/Accordion/AccordionHeader.twig b/packages/web-twig/src/Resources/components/Accordion/AccordionHeader.twig
index 18d2208b9b..af8fd9e7b5 100644
--- a/packages/web-twig/src/Resources/components/Accordion/AccordionHeader.twig
+++ b/packages/web-twig/src/Resources/components/Accordion/AccordionHeader.twig
@@ -14,8 +14,8 @@
 {%- set _iconClassName = _spiritClassPrefix ~ 'Accordion__itemIcon' -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
-{%- set _dataTargetAttr = _for ? 'data-target=' ~ _for : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _dataTargetAttr = _for ? 'data-target="' ~ _for | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -26,14 +26,14 @@
 <{{ _elementType }}
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
-    {{ _idAttr }}
+    {{ _idAttr | raw }}
     {{ classProp(_classNames) }}
 >
     <button
         type="button"
         class="{{ _toggleClassName }}"
         data-toggle="collapse"
-        {{ _dataTargetAttr }}
+        {{ _dataTargetAttr | raw }}
         aria-expanded="{{ _ariaExpanded }}"
         aria-controls="{{ _for }}"
     >
diff --git a/packages/web-twig/src/Resources/components/Accordion/AccordionItem.twig b/packages/web-twig/src/Resources/components/Accordion/AccordionItem.twig
index 3c16f33c81..423582bd0d 100644
--- a/packages/web-twig/src/Resources/components/Accordion/AccordionItem.twig
+++ b/packages/web-twig/src/Resources/components/Accordion/AccordionItem.twig
@@ -7,7 +7,7 @@
 {%- set _rootClassName = _spiritClassPrefix ~ 'Accordion__item' -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -17,7 +17,7 @@
 <{{ _elementType }}
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
-    {{ _idAttr }}
+    {{ _idAttr | raw }}
     {{ classProp(_classNames) }}
 >
     {% block content %}{% endblock %}
diff --git a/packages/web-twig/src/Resources/components/ButtonLink/ButtonLink.twig b/packages/web-twig/src/Resources/components/ButtonLink/ButtonLink.twig
index 219a285205..014fe79c9a 100644
--- a/packages/web-twig/src/Resources/components/ButtonLink/ButtonLink.twig
+++ b/packages/web-twig/src/Resources/components/ButtonLink/ButtonLink.twig
@@ -8,7 +8,6 @@
 {%- set _isLoading = props.isLoading | default(false) | boolprop -%}
 {%- set _isSquare = props.isSquare | default(false) | boolprop -%}
 {%- set _onClick = props.onClick | default(null) -%}
-{%- set _target = props.target | default(null) -%}
 
 {# Class names #}
 {%- set _rootClassName = _spiritClassPrefix ~ 'Button' -%}
@@ -21,13 +20,13 @@
 
 {# Attributes #}
 {%- set _onClickAttr = _onClick ? 'onclick=' ~ _onClick | escape('html_attr') : null -%}
-{%- set _targetAttr = _target ? 'target=' ~ _target : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
 {%- set _classNames = [ _rootClassName, _rootColorClassName, _rootBlockClassName, _rootDisabledClassName, _rootLoadingClassName, _rootSizeClassName, _rootSquareClassName, _styleProps.className ] -%}
 {%- set _allowedAttributes = [
     'title',
+    'target',
 ] -%}
 
 {# Deprecations #}
@@ -41,7 +40,6 @@
     {{ classProp(_classNames) }}
     href="{{ _href }}"
     {{ _onClickAttr | raw }}
-    {{ _targetAttr }}
 >
     {%- block content %}{% endblock %}
     {%- if _isLoading -%}
diff --git a/packages/web-twig/src/Resources/components/Collapse/Collapse.twig b/packages/web-twig/src/Resources/components/Collapse/Collapse.twig
index ea1cc86750..d522b2ae27 100644
--- a/packages/web-twig/src/Resources/components/Collapse/Collapse.twig
+++ b/packages/web-twig/src/Resources/components/Collapse/Collapse.twig
@@ -12,9 +12,9 @@
 {%- set _contentClassName = _spiritClassPrefix ~ 'Collapse__content' -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
-{%- set _dataBreakpointAttr = _breakpoint ? 'data-breakpoint=' ~ _breakpoint : null -%}
-{%- set _dataParentAttr = _parent ? 'data-parent=' ~ _parent : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _dataBreakpointAttr = _breakpoint ? 'data-breakpoint="' ~ _breakpoint | escape('html_attr') ~ '"' : null -%}
+{%- set _dataParentAttr = _parent ? 'data-parent="' ~ _parent | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -24,9 +24,9 @@
 <{{ _elementType }}
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
-    {{ _idAttr }}
-    {{ _dataBreakpointAttr }}
-    {{ _dataParentAttr }}
+    {{ _idAttr | raw }}
+    {{ _dataBreakpointAttr | raw }}
+    {{ _dataParentAttr | raw }}
     {{ classProp(_classNames) }}
 >
     <{{ _elementType }} class="{{ _contentClassName }}">
diff --git a/packages/web-twig/src/Resources/components/Dropdown/Dropdown.twig b/packages/web-twig/src/Resources/components/Dropdown/Dropdown.twig
index 2773fc3124..88d888b84c 100644
--- a/packages/web-twig/src/Resources/components/Dropdown/Dropdown.twig
+++ b/packages/web-twig/src/Resources/components/Dropdown/Dropdown.twig
@@ -15,8 +15,8 @@
 {%- set _leftClassName = _spiritClassPrefix ~ 'Dropdown--left' -%}
 
 {# Attributes #}
-{%- set _dataBreakpointAttr = _breakpoint ? 'data-breakpoint=' ~ _breakpoint : null -%}
-{%- set _dataFullWidthModeAttr = _fullWidthMode ? 'data-fullwidthmode=' ~ _fullWidthMode : null -%}
+{%- set _dataBreakpointAttr = _breakpoint ? 'data-breakpoint="' ~ _breakpoint | escape('html_attr') ~ '"' : null -%}
+{%- set _dataFullWidthModeAttr = _fullWidthMode ? 'data-fullwidthmode="' ~ _fullWidthMode | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -40,8 +40,8 @@
     {{ mainProps(props) }}
     {{ styleProp(_styleProps) }}
     {{ classProp(_classNames) }}
-    {{ _dataBreakpointAttr }}
-    {{ _dataFullWidthModeAttr }}
+    {{ _dataBreakpointAttr | raw }}
+    {{ _dataFullWidthModeAttr | raw }}
 >
     {%- block content %}{% endblock -%}
 </{{ _elementType }}>
diff --git a/packages/web-twig/src/Resources/components/Header/_abstracts/Link.twig b/packages/web-twig/src/Resources/components/Header/_abstracts/Link.twig
index 6f5ac89633..c5f2150a53 100644
--- a/packages/web-twig/src/Resources/components/Header/_abstracts/Link.twig
+++ b/packages/web-twig/src/Resources/components/Header/_abstracts/Link.twig
@@ -5,7 +5,6 @@
 {%- set _isCurrent = props.isCurrent | default(false) -%}
 {%- set _onClick = props.onClick | default(null) -%}
 {%- set _rootClass = props.rootClass -%}
-{%- set _target = props.target | default(null) -%}
 
 {# Class names #}
 {%- set _rootClassName = _spiritClassPrefix ~ _rootClass -%}
@@ -14,10 +13,12 @@
 {# Attributes #}
 {%- set _ariaCurrentAttr = _isCurrent ? 'aria-current=page' : null -%}
 {%- set _onClickAttr = _onClick ? 'onclick=' ~ _onClick | escape('html_attr') : null -%}
-{%- set _targetAttr = _target ? 'target=' ~ _target : null -%}
 
 {# Miscellaneous #}
 {%- set _classNames = [ _rootClassName, _rootCurrentClassName, _class ] -%}
+{%- set _allowedAttributes = [
+    'target',
+] -%}
 
 {# Deprecations #}
 {% if _onClick %}
@@ -25,12 +26,11 @@
 {% endif %}
 
 <a
-    {{ mainProps(props) }}
+    {{ mainProps(props, _allowedAttributes) }}
     {{ classProp(_classNames) }}
     href="{{ _href }}"
     {{ _ariaCurrentAttr }}
     {{ _onClickAttr | raw }}
-    {{ _targetAttr }}
 >
     {% block content %}{% endblock %}
 </a>
diff --git a/packages/web-twig/src/Resources/components/Link/Link.twig b/packages/web-twig/src/Resources/components/Link/Link.twig
index 3fff76cb7d..785b0d24cd 100644
--- a/packages/web-twig/src/Resources/components/Link/Link.twig
+++ b/packages/web-twig/src/Resources/components/Link/Link.twig
@@ -5,7 +5,6 @@
 {%- set _isDisabled = props.isDisabled | default(false) | boolprop -%}
 {%- set _isUnderlined = props.isUnderlined | default(false) | boolprop -%}
 {%- set _onClick = props.onClick | default(null) -%}
-{%- set _target = props.target | default(null) -%}
 
 {# Class names #}
 {%- set _colorClassName = _spiritClassPrefix ~ 'link-' ~ _color -%}
@@ -14,13 +13,13 @@
 
 {# Attributes #}
 {%- set _onClickAttr = _onClick ? 'onclick=' ~ _onClick | escape('html_attr') : null -%}
-{%- set _targetAttr = _target ? 'target=' ~ _target : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
 {%- set _classNames = [ _colorClassName, _rootDisabledClassName, _rootUnderlinedClassName, _styleProps.className ] -%}
 {%- set _allowedAttributes = [
     'title',
+    'target',
 ] -%}
 
 {# Deprecations #}
@@ -34,7 +33,6 @@
     {{ styleProp(_styleProps) }}
     {{ classProp(_classNames) }}
     {{ _onClickAttr | raw }}
-    {{ _targetAttr }}
 >
     {%- block content %}{% endblock %}
 </a>
diff --git a/packages/web-twig/src/Resources/components/Modal/Modal.twig b/packages/web-twig/src/Resources/components/Modal/Modal.twig
index 22e407cd74..2be9eece7a 100644
--- a/packages/web-twig/src/Resources/components/Modal/Modal.twig
+++ b/packages/web-twig/src/Resources/components/Modal/Modal.twig
@@ -11,7 +11,7 @@
 {%- set _rootClassName = _spiritClassPrefix ~ 'Modal' -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
diff --git a/packages/web-twig/src/Resources/components/Modal/ModalComposed.twig b/packages/web-twig/src/Resources/components/Modal/ModalComposed.twig
index f56190cd1f..3bf29a5d45 100644
--- a/packages/web-twig/src/Resources/components/Modal/ModalComposed.twig
+++ b/packages/web-twig/src/Resources/components/Modal/ModalComposed.twig
@@ -8,8 +8,8 @@
 {%- set _rootComposedClassName = _spiritClassPrefix ~ 'Modal--composed' -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
-{%- set _ariaLabelledbyAttr = _id ? 'aria-labelledby=' ~ _titleId : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _ariaLabelledbyAttr = _id ? 'aria-labelledby="' ~ _titleId | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -23,8 +23,8 @@
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
     {{ classProp(_classNames) }}
-    {{ _idAttr }}
-    {{ _ariaLabelledbyAttr }}
+    {{ _idAttr | raw }}
+    {{ _ariaLabelledbyAttr | raw }}
 >
     {% block content %}{% endblock %}
 </dialog>
diff --git a/packages/web-twig/src/Resources/components/Modal/ModalHeader.twig b/packages/web-twig/src/Resources/components/Modal/ModalHeader.twig
index fef55ebd08..f21b440fc5 100644
--- a/packages/web-twig/src/Resources/components/Modal/ModalHeader.twig
+++ b/packages/web-twig/src/Resources/components/Modal/ModalHeader.twig
@@ -10,7 +10,7 @@
 {%- set _titleClassName = _spiritClassPrefix ~ 'ModalHeader__title' -%}
 
 {# Attributes #}
-{%- set _titleIdAttr = _titleId ? 'id=' ~ _titleId : null -%}
+{%- set _titleIdAttr = _titleId ? 'id="' ~ _titleId | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -24,7 +24,7 @@
     {% if block('content') is not empty %}
         <h2
             class="{{ _titleClassName }}"
-            {{ _titleIdAttr }}
+            {{ _titleIdAttr | raw }}
         >
             {% block content %}{% endblock %}
         </h2>
diff --git a/packages/web-twig/src/Resources/components/RadioField/RadioField.twig b/packages/web-twig/src/Resources/components/RadioField/RadioField.twig
index 82d2bbdaef..9335eddbe5 100644
--- a/packages/web-twig/src/Resources/components/RadioField/RadioField.twig
+++ b/packages/web-twig/src/Resources/components/RadioField/RadioField.twig
@@ -28,27 +28,26 @@
 {%- set _checkedAttr = _isChecked ? 'checked' : null -%}
 {%- set _disabledAttr = _isDisabled ? 'disabled' : null -%}
 {%- set _valueAttr = _value ? 'value=' ~ _value : null -%}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
-{%- set _labelForAttr = _id ? 'for=' ~ _id : null -%}
-{%- set _autocompleteAttr = _autocomplete ? 'autocomplete=' ~ _autocomplete : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _labelForAttr = _id ? 'for="' ~ _id | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
 {%- set _classNames = [ _rootClassName, _rootDisabledClassName, _rootItemClassName, _rootValidationStateClassName, _styleProps.className ] -%}
 {%- set _labelClassName = [ _labelClassName, _labelHiddenClassName ] -%}
 {%- set _mainPropsWithoutId = props | filter((value, prop) => prop != 'id') -%}
+{%- set _allowedInputAttributes = [ 'autocomplete' ] -%}
 
-<label {{ _labelForAttr }} {{ mainProps(_mainPropsWithoutId) }} {{ styleProp(_styleProps) }} {{ classProp(_classNames) }}>
+<label {{ _labelForAttr | raw }} {{ mainProps(_mainPropsWithoutId) }} {{ styleProp(_styleProps) }} {{ classProp(_classNames) }}>
     <input
-        {{ inputProps(props) }}
+        {{ inputProps(props, _allowedInputAttributes) }}
         type="radio"
         name="{{ _name }}"
         class="{{ _inputClassName }}"
-        {{ _idAttr }}
+        {{ _idAttr | raw }}
         {{ _checkedAttr }}
         {{ _disabledAttr }}
         {{ _valueAttr }} {# Intentionally without `raw` to prevent XSS. #}
-        {{ _autocompleteAttr }}
     />
     <span class="{{ _textClassName }}">
         <span {{ classProp(_labelClassName) }}>{% if _unsafeLabel %}{{ _unsafeLabel | raw }}{% else %}{{ _label }}{% endif %}</span>
diff --git a/packages/web-twig/src/Resources/components/Tabs/README.md b/packages/web-twig/src/Resources/components/Tabs/README.md
index 54036ef485..2685c98d01 100644
--- a/packages/web-twig/src/Resources/components/Tabs/README.md
+++ b/packages/web-twig/src/Resources/components/Tabs/README.md
@@ -59,7 +59,6 @@ There is no API for TabItem.
 | Prop name    | Type      | Default | Required | Description                  |
 | ------------ | --------- | ------- | -------- | ---------------------------- |
 | `href`       | `string`  | `null`  | no       | URL target of a link         |
-| `id`         | `string ` | `null`  | no       | Tab item identification      |
 | `isSelected` | `boolean` | `false` | no       | Whether is tab item selected |
 | `target`     | `string`  | `null`  | no       | Target tab pane ID           |
 
diff --git a/packages/web-twig/src/Resources/components/Tabs/TabLink.twig b/packages/web-twig/src/Resources/components/Tabs/TabLink.twig
index 4b212d6078..bf9bb73c71 100644
--- a/packages/web-twig/src/Resources/components/Tabs/TabLink.twig
+++ b/packages/web-twig/src/Resources/components/Tabs/TabLink.twig
@@ -2,7 +2,6 @@
 {%- set props = props | default([]) -%}
 {%- set _ariaTarget = props.ariaTarget | default(null) -%}
 {%- set _href = props.href | default(null) -%}
-{%- set _id = props.id | default(null) -%}
 {%- set _isSelected = props.isSelected | default(false) | boolprop -%}
 {%- set _target = props.target | default(null) -%}
 
@@ -11,32 +10,29 @@
 {%- set _rootClassName = _spiritClassPrefix ~ 'Tabs__link' -%}
 
 {# Attributes #}
-{%- set _ariaControlsAttr = _target ? 'aria-controls=' ~ _target : null -%}
-{%- set _dataTargetAttr = _target ? 'data-target=#' ~ _target : null -%}
-{%- set _dataToggleAttr = _href ? null : 'data-toggle=tabs' -%}
-{%- set _hrefAttr = _href ? 'href=' ~ _href : null -%}
-{%- set _idAttr = _id ? ' id=' ~ _id : null -%}
-{%- set _roleAttr = _href ? 'role=tab' : null -%}
-{%- set _typeAttr = _href ? null : 'type=button' -%}
+{%- set _ariaControlsAttr = _target ? 'aria-controls="' ~ _target | escape('html_attr') ~ '"' : null -%}
+{%- set _dataTargetAttr = _target ? 'data-target="#' ~ _target | escape('html_attr') ~ '"' : null -%}
+{%- set _dataToggleAttr = _href ? null : 'data-toggle="tabs"' -%}
+{%- set _roleAttr = _href ? 'role="tab"' : null -%}
+{%- set _typeAttr = _href ? null : 'type="button"' -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
 {%- set _ariaSelected = _isSelected ? 'true' : 'false' -%}
 {%- set _classNames = [ _rootClassName, _isSelectedClassName, _styleProps.className ] -%}
 {%- set _elementType = _href ? 'a' : 'button' -%}
+{%- set _allowedAttributes = _href ? [ 'href' ] : [] -%}
 
 <{{ _elementType }}
-    {{ mainProps(props) }}
+    {{ mainProps(props, _allowedAttributes) }}
     {{ styleProp(_styleProps) }}
     {{ classProp(_classNames) }}
     aria-selected="{{ _ariaSelected }}"
-    {{ _ariaControlsAttr }}
-    {{ _dataTargetAttr }}
-    {{ _dataToggleAttr }}
-    {{ _hrefAttr }}
-    {{ _idAttr }}
-    {{ _roleAttr }}
-    {{ _typeAttr }}
+    {{ _ariaControlsAttr | raw }}
+    {{ _dataTargetAttr | raw }}
+    {{ _dataToggleAttr | raw }}
+    {{ _roleAttr | raw }}
+    {{ _typeAttr | raw }}
 >
     {% block content %}{% endblock %}
 </{{ _elementType }}>
diff --git a/packages/web-twig/src/Resources/components/TextFieldBase/TextFieldBase.twig b/packages/web-twig/src/Resources/components/TextFieldBase/TextFieldBase.twig
index 0da00c8e35..6d637688ac 100644
--- a/packages/web-twig/src/Resources/components/TextFieldBase/TextFieldBase.twig
+++ b/packages/web-twig/src/Resources/components/TextFieldBase/TextFieldBase.twig
@@ -13,14 +13,12 @@
 {%- set _message = props.message | default(null) -%}
 {%- set _unsafeMessage = props.UNSAFE_message | default(null) -%}
 {%- set _name = props.name | default(null) -%}
-{%- set _placeholder = props.placeholder | default(null) -%}
 {%- set _type = props.type | default('text') -%}
 {%- set _validationState = props.validationState | default(null) -%}
 {%- set _value = props.value | default(null) -%}
 
 {# Extended API for TextArea #}
 {%- set _isAutoResizing = props.isAutoResizing | default(false) | boolprop -%}
-{%- set _rows = props.rows | default(null) -%}
 
 {# Extended API for TextField #}
 {%- set _hasPasswordToggle = props.hasPasswordToggle | default(false) | boolprop -%}
@@ -46,22 +44,19 @@
 {# Attributes #}
 {%- set _dataToggleAttr = _isAutoResizing and _isMultiline ? 'data-toggle=autoResize' : null -%}
 {%- set _disabledAttr = _isDisabled ? 'disabled' : null -%}
-{%- set _placeholderAttr = _placeholder ? 'placeholder=' ~ _placeholder : null -%}
 {%- set _requiredAttr = _isRequired ? 'required' : null -%}
-{%- set _valueAttr = _value ? 'value=' ~ _value : null -%}
-
-{# Extended Attributes for TextArea #}
-{%- set _rowsAttr = _rows ? 'rows=' ~ _rows : null -%}
 
 {# Extended Attributes for TextField #}
-{%- set _inputWidthAttr = _inputWidth ? 'size=' ~ _inputWidth : null -%}
+{%- set _inputWidthAttr = _inputWidth ? 'size="' ~ _inputWidth | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
 {%- set _rootClassNames = [ _rootClassName, _rootDisabledClassName, _rootFluidClassName, _rootValidationStateClassName, _styleProps.className ] -%}
 {%- set _labelClassNames = [ _labelClassName, _labelHiddenClassName, _labelRequiredClassName ] -%}
 {%- set _mainPropsWithoutReservedAttributes = props | filter((value, prop) => prop != 'id' and (_isAutoResizing and prop != 'data-toggle')) -%}
-{%- set _allowedAttributes = [ 'autocomplete' ] -%}
+{%- set _allowedAttributes = [ 'autocomplete', 'placeholder'] -%}
+{%- set _textFieldAllowedAttributes = _allowedAttributes | merge([ 'value' ]) -%}
+{%- set _textAreaAllowedAttributes = _allowedAttributes | merge([ 'rows' ]) -%}
 
 {# Deprecations #}
 {% if _validationState is same as('error') %}
@@ -77,12 +72,10 @@
     </label>
     {% if _isMultiline %}
         <textarea
-            {{ inputProps(props, _allowedAttributes) }}
+            {{ inputProps(props, _textAreaAllowedAttributes) }}
             id="{{ _id }}"
             name="{{ _name }}"
             class="{{ _inputClassName }}"
-            {{ _rowsAttr }}
-            {{ _placeholderAttr }}
             {{ _disabledAttr }}
             {{ _requiredAttr }}
         >{{ _value }}</textarea>{# Intentionally without `raw` to prevent XSS. #}
@@ -90,16 +83,14 @@
         {% if _hasPasswordToggle %}
             <div class="{{ _passwordToggleClassName }}">
                 <input
-                    {{ inputProps(props, _allowedAttributes) }}
+                    {{ inputProps(props, _textFieldAllowedAttributes) }}
                     type="password"
                     id="{{ _id }}"
                     name="{{ _name }}"
                     class="{{ _inputClassName }}"
                     {{ _disabledAttr }}
-                    {{ _inputWidthAttr }}
-                    {{ _placeholderAttr }}
+                    {{ _inputWidthAttr | raw }}
                     {{ _requiredAttr }}
-                    {{ _valueAttr }}
                 />
                 <button
                     type="button"
@@ -119,16 +110,14 @@
             </div>
         {% else %}
             <input
-                {{ inputProps(props, _allowedAttributes) }}
+                {{ inputProps(props, _textFieldAllowedAttributes) }}
                 type="{{ _type }}"
                 id="{{ _id }}"
                 name="{{ _name }}"
                 class="{{ _inputClassName }}"
                 {{ _disabledAttr }}
-                {{ _inputWidthAttr }}
-                {{ _placeholderAttr }}
+                {{ _inputWidthAttr | raw }}
                 {{ _requiredAttr }}
-                {{ _valueAttr }} {# Intentionally without `raw` to prevent XSS. #}
             />
         {% endif %}
     {% endif %}
diff --git a/packages/web-twig/src/Resources/components/Tooltip/Tooltip.twig b/packages/web-twig/src/Resources/components/Tooltip/Tooltip.twig
index c6780c4f63..5abadadf45 100644
--- a/packages/web-twig/src/Resources/components/Tooltip/Tooltip.twig
+++ b/packages/web-twig/src/Resources/components/Tooltip/Tooltip.twig
@@ -13,7 +13,9 @@
 {%- set _rootPlacementClassName = _spiritClassPrefix ~ 'Tooltip--' ~ _placement -%}
 
 {# Attributes #}
-{%- set _idAttr = _id ? 'id=' ~ _id : null -%}
+{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _ariaControlsAttr = _id ? 'aria-controls="' ~ _id | escape('html_attr') ~ '"' : null -%}
+{%- set _dataTargetAttr = _id ? 'data-target="#' ~ _id | escape('html_attr') ~ '"' : null -%}
 
 {# Miscellaneous #}
 {%- set _styleProps = useStyleProps(props) -%}
@@ -24,7 +26,7 @@
     {{ mainProps(_mainPropsWithoutId) }}
     {{ styleProp(_styleProps) }}
     {{ classProp(_classNames) }}
-    {{ _idAttr }}
+    {{ _idAttr | raw }}
 >
     {% block content %}{% endblock %}
     {% if _isDismissible == 'true' %}
@@ -32,8 +34,8 @@
             type="button"
             class="{{ _closeClassName }}"
             data-dismiss="tooltip"
-            data-target="#{{ _id }}"
-            aria-controls="{{ _id }}"
+            {{ _ariaControlsAttr | raw }}
+            {{ _dataTargetAttr | raw }}
             aria-expanded="true"
         >
             <Icon name="close" aria-hidden="true" />
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerDialogLink.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerDialogLink.twig__1.html
index a20d8c1c56..7c1d1ed557 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerDialogLink.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerDialogLink.twig__1.html	
@@ -7,6 +7,6 @@
     <a class="HeaderDialogLink" href="/job-offers">Job offers</a> <!-- Render as current page -->
      <a class="HeaderDialogLink HeaderDialogLink--current" href="/job-offers" aria-current="page">Job offers</a> 
     <!-- Render with all props -->
-     <a class="HeaderDialogLink HeaderDialogLink--current" href="https://spirit.design" aria-current="page" onclick="console.log('Hello!')" target="_blank">Job offers</a>
+     <a target="_blank" class="HeaderDialogLink HeaderDialogLink--current" href="https://spirit.design" aria-current="page" onclick="console.log('Hello!')">Job offers</a>
   </body>
 </html>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerLink.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerLink.twig__1.html
index 5161172392..ceefdd3ae2 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerLink.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set headerLink.twig__1.html	
@@ -7,6 +7,6 @@
     <a class="HeaderLink" href="/job-offers">Job offers</a> <!-- Render as current page -->
      <a class="HeaderLink HeaderLink--current" href="/job-offers" aria-current="page">Job offers</a> 
     <!-- Render with all props -->
-     <a class="HeaderLink HeaderLink--current" href="https://spirit.design" aria-current="page" onclick="console.log('Hello!')" target="_blank">Job offers</a>
+     <a target="_blank" class="HeaderLink HeaderLink--current" href="https://spirit.design" aria-current="page" onclick="console.log('Hello!')">Job offers</a>
   </body>
 </html>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set linkDefault.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set linkDefault.twig__1.html
index 04cb3937c1..4399c10939 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set linkDefault.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set linkDefault.twig__1.html	
@@ -7,6 +7,6 @@
     <a href="" class="link-primary">Example link</a> <!-- Render as an underlined secondary link -->
      <a href="/" class="link-secondary link-underlined">Example link</a> <!-- Render as disabled -->
      <a href="/" class="link-primary link-disabled">Example link</a> <!-- Render with all props -->
-     <a title="test title" href="https://spirit.design" class="link-inverted link-disabled link-underlined my-custom-class" onclick="console.log('Hello!');" target="_blank">Example link</a>
+     <a target="_blank" title="test title" href="https://spirit.design" class="link-inverted link-disabled link-underlined my-custom-class" onclick="console.log('Hello!');">Example link</a>
   </body>
 </html>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tabsDefault.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tabsDefault.twig__1.html
index 4a9b52e141..fc8cbc9d3a 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tabsDefault.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tabsDefault.twig__1.html	
@@ -6,13 +6,13 @@
   <body>
     <ul class="Tabs" role="tablist">
       <li class="Tabs__item">
-        <button class="Tabs__link is-selected" aria-selected="true" aria-controls="pane1" data-target="#pane1" data-toggle="tabs" id="pane1-tab" type="button">Item selected</button>
+        <button id="pane1-tab" class="Tabs__link is-selected" aria-selected="true" aria-controls="pane1" data-target="#pane1" data-toggle="tabs" type="button">Item selected</button>
       </li>
       <li class="Tabs__item">
-        <button class="Tabs__link" aria-selected="false" aria-controls="pane2" data-target="#pane2" data-toggle="tabs" id="pane2-tab" type="button">Item</button>
+        <button id="pane2-tab" class="Tabs__link" aria-selected="false" aria-controls="pane2" data-target="#pane2" data-toggle="tabs" type="button">Item</button>
       </li>
       <li class="Tabs__item">
-        <a class="Tabs__link" aria-selected="false" href="https://www.example.com" role="tab">Item link</a>
+        <a href="https://www.example.com" class="Tabs__link" aria-selected="false" role="tab">Item link</a>
       </li>
     </ul>
     <div class="TabsPane is-selected" role="tabpanel" aria-labelledby="pane1-tab" id="pane1">
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textAreaDefault.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textAreaDefault.twig__1.html
index fc6d06b949..163c10a5bd 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textAreaDefault.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textAreaDefault.twig__1.html	
@@ -6,7 +6,7 @@
   <body>
     <div class="TextArea TextArea--error">
       <label for="example" class="TextArea__label TextArea__label--required">TextArea</label> 
-      <textarea minlength="6" maxlength="10" id="example" name="example" class="TextArea__input" rows="10" required="">TextArea value</textarea>
+      <textarea minlength="6" maxlength="10" rows="10" id="example" name="example" class="TextArea__input" required="">TextArea value</textarea>
       <div class="TextArea__message">
         validation failed
       </div>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldBaseDefault.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldBaseDefault.twig__1.html
index b02e76f048..38bde3db59 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldBaseDefault.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldBaseDefault.twig__1.html	
@@ -5,7 +5,7 @@
   </head>
   <body>
     <div class="TextField TextField--error">
-      <label for="example" class="TextField__label TextField__label--required">Text field</label> <input minlength="6" autocomplete="on" type="text" id="example" name="example" class="TextField__input" size="10" required="">
+      <label for="example" class="TextField__label TextField__label--required">Text field</label> <input minlength="6" autocomplete="on" placeholder="Very long text" value="Some long value" type="text" id="example" name="example" class="TextField__input" size="10" required="">
       <div class="TextField__message">
         validation failed
       </div>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldDefault.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldDefault.twig__1.html
index 1fe7695a04..fa4b738337 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldDefault.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldDefault.twig__1.html	
@@ -5,7 +5,7 @@
   </head>
   <body>
     <div class="TextField TextField--error">
-      <label for="example" class="TextField__label TextField__label--required">Text field</label> <input minlength="6" type="text" id="example" name="example" class="TextField__input" required="">
+      <label for="example" class="TextField__label TextField__label--required">Text field</label> <input minlength="6" placeholder="Some long placeholder" value="Some long value" type="text" id="example" name="example" class="TextField__input" required="">
       <div class="TextField__message">
         validation failed
       </div>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldNotRequired.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldNotRequired.twig__1.html
index 57430e5e84..3ad9bdcad1 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldNotRequired.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set textFieldNotRequired.twig__1.html	
@@ -5,7 +5,7 @@
   </head>
   <body>
     <div class="TextField">
-      <label for="example" class="TextField__label">Text field</label> <input type="text" id="example" name="example" class="TextField__input" value="filled">
+      <label for="example" class="TextField__label">Text field</label> <input value="filled" type="text" id="example" name="example" class="TextField__input">
     </div>
   </body>
 </html>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefault.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefault.twig__1.html
index e2c41e1c7e..49650353a5 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefault.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefault.twig__1.html	
@@ -5,7 +5,7 @@
   </head>
   <body>
     <div class="Tooltip Tooltip--right Tooltip--dismissible" id="my-tooltip">
-      Hello there! <button type="button" class="Tooltip__close" data-dismiss="tooltip" data-target="#my-tooltip" aria-controls="my-tooltip" aria-expanded="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" id="a79dff7a255f69bbe6e39d594aa2275b" aria-hidden="true">
+      Hello there! <button type="button" class="Tooltip__close" data-dismiss="tooltip" aria-controls="my-tooltip" data-target="#my-tooltip" aria-expanded="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" id="a79dff7a255f69bbe6e39d594aa2275b" aria-hidden="true">
       <path d="M18.3002 5.70997C17.9102 5.31997 17.2802 5.31997 16.8902 5.70997L12.0002 10.59L7.11022 5.69997C6.72022 5.30997 6.09021 5.30997 5.70021 5.69997C5.31021 6.08997 5.31021 6.71997 5.70021 7.10997L10.5902 12L5.70021 16.89C5.31021 17.28 5.31021 17.91 5.70021 18.3C6.09021 18.69 6.72022 18.69 7.11022 18.3L12.0002 13.41L16.8902 18.3C17.2802 18.69 17.9102 18.69 18.3002 18.3C18.6902 17.91 18.6902 17.28 18.3002 16.89L13.4102 12L18.3002 7.10997C18.6802 6.72997 18.6802 6.08997 18.3002 5.70997Z" fill="#132930"></path></svg> <span class="accessibility-hidden">Close</span></button>
     </div>
   </body>
diff --git a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefaultPure.twig__1.html b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefaultPure.twig__1.html
index e2c41e1c7e..49650353a5 100644
--- a/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefaultPure.twig__1.html	
+++ b/packages/web-twig/tests/__snapshots__/ComponentsSnapshotTest__test with data set tooltipDefaultPure.twig__1.html	
@@ -5,7 +5,7 @@
   </head>
   <body>
     <div class="Tooltip Tooltip--right Tooltip--dismissible" id="my-tooltip">
-      Hello there! <button type="button" class="Tooltip__close" data-dismiss="tooltip" data-target="#my-tooltip" aria-controls="my-tooltip" aria-expanded="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" id="a79dff7a255f69bbe6e39d594aa2275b" aria-hidden="true">
+      Hello there! <button type="button" class="Tooltip__close" data-dismiss="tooltip" aria-controls="my-tooltip" data-target="#my-tooltip" aria-expanded="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" id="a79dff7a255f69bbe6e39d594aa2275b" aria-hidden="true">
       <path d="M18.3002 5.70997C17.9102 5.31997 17.2802 5.31997 16.8902 5.70997L12.0002 10.59L7.11022 5.69997C6.72022 5.30997 6.09021 5.30997 5.70021 5.69997C5.31021 6.08997 5.31021 6.71997 5.70021 7.10997L10.5902 12L5.70021 16.89C5.31021 17.28 5.31021 17.91 5.70021 18.3C6.09021 18.69 6.72022 18.69 7.11022 18.3L12.0002 13.41L16.8902 18.3C17.2802 18.69 17.9102 18.69 18.3002 18.3C18.6902 17.91 18.6902 17.28 18.3002 16.89L13.4102 12L18.3002 7.10997C18.6802 6.72997 18.6802 6.08997 18.3002 5.70997Z" fill="#132930"></path></svg> <span class="accessibility-hidden">Close</span></button>
     </div>
   </body>
diff --git a/packages/web-twig/tests/components-fixtures/textFieldBaseDefault.twig b/packages/web-twig/tests/components-fixtures/textFieldBaseDefault.twig
index cfd562ce99..2042c25439 100644
--- a/packages/web-twig/tests/components-fixtures/textFieldBaseDefault.twig
+++ b/packages/web-twig/tests/components-fixtures/textFieldBaseDefault.twig
@@ -1 +1,14 @@
-<TextFieldBase id="example" label="Text field" type="text" name="example" isRequired validationState="error" message="validation failed" inputWidth="10" minlength="6" autocomplete="on" />
+<TextFieldBase
+    id="example"
+    label="Text field"
+    type="text"
+    name="example"
+    isRequired
+    validationState="error"
+    message="validation failed"
+    inputWidth="10"
+    minlength="6"
+    autocomplete="on"
+    placeholder="Very long text"
+    value="Some long value"
+/>
diff --git a/packages/web-twig/tests/components-fixtures/textFieldBaseMultiline.twig b/packages/web-twig/tests/components-fixtures/textFieldBaseMultiline.twig
index 0c594cbbdf..db1d0746d6 100644
--- a/packages/web-twig/tests/components-fixtures/textFieldBaseMultiline.twig
+++ b/packages/web-twig/tests/components-fixtures/textFieldBaseMultiline.twig
@@ -1 +1,11 @@
-<TextFieldBase id="example" label="Textarea" type="text" name="example" isRequired isMultiline validationState="error" message="validation failed" minlength="6" />
+<TextFieldBase
+    id="example"
+    label="Textarea"
+    type="text"
+    name="example"
+    isRequired
+    isMultiline
+    validationState="error"
+    message="validation failed"
+    minlength="6"
+/>
diff --git a/packages/web-twig/tests/components-fixtures/textFieldDefault.twig b/packages/web-twig/tests/components-fixtures/textFieldDefault.twig
index 330d94806a..5616b698f2 100644
--- a/packages/web-twig/tests/components-fixtures/textFieldDefault.twig
+++ b/packages/web-twig/tests/components-fixtures/textFieldDefault.twig
@@ -1 +1,12 @@
-<TextField id="example" label="Text field" type="text" name="example" isRequired validationState="error" message="validation failed" minlength="6" />
+<TextField
+    id="example"
+    label="Text field"
+    type="text"
+    name="example"
+    isRequired
+    validationState="error"
+    message="validation failed"
+    minlength="6"
+    placeholder="Some long placeholder"
+    value="Some long value"
+/>