diff --git a/package-lock.json b/package-lock.json
index 28883b57..9f3c5d96 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,7 +18,7 @@
         "clean-deep": "^3.4.0",
         "copy-to-clipboard": "^3.3.3",
         "deepmerge": "^4.3.1",
-        "design-react-kit": "^5.0.0-0",
+        "design-react-kit": "^5.0.0-7",
         "dotenv": "^16.3.1",
         "draft-js": "^0.11.7",
         "i18next": "^23.2.2",
@@ -4280,9 +4280,9 @@
       }
     },
     "node_modules/bootstrap-italia": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/bootstrap-italia/-/bootstrap-italia-2.5.1.tgz",
-      "integrity": "sha512-wuvX2KgObUKDbP8RK48kaVBaaPEt6+TkvzbuivQ4VU/K8hdvNonN2zS5GYVqibyXCfl8VsbN8dbwGS/oLqzpdw==",
+      "version": "2.7.9",
+      "resolved": "https://registry.npmjs.org/bootstrap-italia/-/bootstrap-italia-2.7.9.tgz",
+      "integrity": "sha512-CdUmj4mxzoEfbdbQzLq7+mc1qaIwMLApGDzET59mQCpvcG+xdzNRUC2kwPxVHfZOC9O9zd7J0agy80R0DaUPLA==",
       "dependencies": {
         "@popperjs/core": "^2.11.2",
         "@splidejs/splide": "^3.6.12",
@@ -4290,7 +4290,8 @@
         "accessible-autocomplete": "^2.0.4",
         "animejs": "^3.2.1",
         "bootstrap": "5.2.3",
-        "just-validate": "^3.5.1",
+        "design-tokens-italia": "^1.1.1",
+        "just-validate": "^3.10.0",
         "masonry-layout": "^4.2.2",
         "progressbar.js": "^1.1.0",
         "uuid": "^8.3.2",
@@ -6635,9 +6636,9 @@
       "integrity": "sha512-+1q0nXhdzg1IpIJdMKalUwvvskeKnYyEe3shPRwedNcWtnhEKT3ZxvFjzywHDeGcKViIxTCAoOYQWP1qD7VNyg=="
     },
     "node_modules/design-react-kit": {
-      "version": "5.0.0-0",
-      "resolved": "https://registry.npmjs.org/design-react-kit/-/design-react-kit-5.0.0-0.tgz",
-      "integrity": "sha512-akifvXFQN4xt6m50kUb/etnjHuudf4o4I+Iwtf7K2vsfBTVaa2DL2f5Poy5jUU/IAxTV3Z6WugQobq6zT1fllg==",
+      "version": "5.0.0-7",
+      "resolved": "https://registry.npmjs.org/design-react-kit/-/design-react-kit-5.0.0-7.tgz",
+      "integrity": "sha512-t9jLZmWdhNOvbdKMMeBjOVc3Sk7woe6b30pV4ooZfIsNPxRPTcCgSiVe/F9ShiSUOg7yy70apnpiM4TlulU8IQ==",
       "dependencies": {
         "classnames": "^2.3.1",
         "is-number": "^7.0.0",
@@ -6653,7 +6654,7 @@
         "node": ">=14"
       },
       "peerDependencies": {
-        "bootstrap-italia": "^2.3.4",
+        "bootstrap-italia": "2.7.9",
         "react": ">=17.0.2"
       }
     },
@@ -6727,6 +6728,11 @@
         "react-dom": "^16.8.0 || ^17 || ^18"
       }
     },
+    "node_modules/design-tokens-italia": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/design-tokens-italia/-/design-tokens-italia-1.1.1.tgz",
+      "integrity": "sha512-WCDGP1ASq8s0MlwoJLhBGBl/kX/4PFU93xEBXsFELyYgdaDQMg9qZJH379f1HktMNWnLmKCBqd8qZju/o+0wVA=="
+    },
     "node_modules/destroy": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
@@ -23952,9 +23958,9 @@
       "requires": {}
     },
     "bootstrap-italia": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/bootstrap-italia/-/bootstrap-italia-2.5.1.tgz",
-      "integrity": "sha512-wuvX2KgObUKDbP8RK48kaVBaaPEt6+TkvzbuivQ4VU/K8hdvNonN2zS5GYVqibyXCfl8VsbN8dbwGS/oLqzpdw==",
+      "version": "2.7.9",
+      "resolved": "https://registry.npmjs.org/bootstrap-italia/-/bootstrap-italia-2.7.9.tgz",
+      "integrity": "sha512-CdUmj4mxzoEfbdbQzLq7+mc1qaIwMLApGDzET59mQCpvcG+xdzNRUC2kwPxVHfZOC9O9zd7J0agy80R0DaUPLA==",
       "requires": {
         "@popperjs/core": "^2.11.2",
         "@splidejs/splide": "^3.6.12",
@@ -23962,7 +23968,8 @@
         "accessible-autocomplete": "^2.0.4",
         "animejs": "^3.2.1",
         "bootstrap": "5.2.3",
-        "just-validate": "^3.5.1",
+        "design-tokens-italia": "^1.1.1",
+        "just-validate": "^3.10.0",
         "masonry-layout": "^4.2.2",
         "progressbar.js": "^1.1.0",
         "uuid": "^8.3.2",
@@ -25678,9 +25685,9 @@
       "integrity": "sha512-+1q0nXhdzg1IpIJdMKalUwvvskeKnYyEe3shPRwedNcWtnhEKT3ZxvFjzywHDeGcKViIxTCAoOYQWP1qD7VNyg=="
     },
     "design-react-kit": {
-      "version": "5.0.0-0",
-      "resolved": "https://registry.npmjs.org/design-react-kit/-/design-react-kit-5.0.0-0.tgz",
-      "integrity": "sha512-akifvXFQN4xt6m50kUb/etnjHuudf4o4I+Iwtf7K2vsfBTVaa2DL2f5Poy5jUU/IAxTV3Z6WugQobq6zT1fllg==",
+      "version": "5.0.0-7",
+      "resolved": "https://registry.npmjs.org/design-react-kit/-/design-react-kit-5.0.0-7.tgz",
+      "integrity": "sha512-t9jLZmWdhNOvbdKMMeBjOVc3Sk7woe6b30pV4ooZfIsNPxRPTcCgSiVe/F9ShiSUOg7yy70apnpiM4TlulU8IQ==",
       "requires": {
         "classnames": "^2.3.1",
         "is-number": "^7.0.0",
@@ -25744,6 +25751,11 @@
         }
       }
     },
+    "design-tokens-italia": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/design-tokens-italia/-/design-tokens-italia-1.1.1.tgz",
+      "integrity": "sha512-WCDGP1ASq8s0MlwoJLhBGBl/kX/4PFU93xEBXsFELyYgdaDQMg9qZJH379f1HktMNWnLmKCBqd8qZju/o+0wVA=="
+    },
     "destroy": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
diff --git a/package.json b/package.json
index e2d3368d..f5aa7c92 100644
--- a/package.json
+++ b/package.json
@@ -84,7 +84,7 @@
     "clean-deep": "^3.4.0",
     "copy-to-clipboard": "^3.3.3",
     "deepmerge": "^4.3.1",
-    "design-react-kit": "^5.0.0-0",
+    "design-react-kit": "^5.0.0-7",
     "dotenv": "^16.3.1",
     "draft-js": "^0.11.7",
     "i18next": "^23.2.2",
diff --git a/src/app/app.tsx b/src/app/app.tsx
index f915ccd4..5fe6dc6f 100644
--- a/src/app/app.tsx
+++ b/src/app/app.tsx
@@ -1,7 +1,8 @@
 import { useState } from "react";
 import { render } from "react-dom";
-import store from "./store/index";
 import { Provider } from "react-redux";
+
+import store from "./store/index";
 import "../i18n";
 import Layout from "./components/Layout";
 import { Editor } from "./components/Editor";
diff --git a/src/app/form/widgets/BaseInputWidget.js b/src/app/form/widgets/BaseInputWidget.js
index dd57a705..69ec3d89 100644
--- a/src/app/form/widgets/BaseInputWidget.js
+++ b/src/app/form/widgets/BaseInputWidget.js
@@ -1,9 +1,9 @@
 import { useState } from "react";
 import PropTypes from "prop-types";
-import classNames from "classnames";
 import Info from "../../components/Info";
 import { useController, useFormContext } from "react-hook-form";
 import { get } from "lodash";
+import { Input } from "design-react-kit";
 
 const BaseInputWidget = (props) => {
   const name = props.fieldName;
@@ -42,25 +42,26 @@ const BaseInputWidget = (props) => {
     defaultValue:
       props.schema.value || innerPropertyDefaultValue || defaultValue || "",
   });
-  const className = classNames(["form-group", { "has-error": invalid }]);
   const [count, setCount] = useState(0);
 
   return (
-    <div className={className}>
-      {props.showLabel && (
-        <label className="control-label" htmlFor={id}>
-          {props.label} {props.schema.language ? `(${props.schema.lang})` : ""}{" "}
-          {props.required ? "*" : ""}
-        </label>
-      )}
-
-      <input
+    <>
+      <Input
         {...inputProps}
+        label={
+          props.showLabel &&
+          `${props.label}${
+            props.schema.language ? ` (${props.schema.lang})` : ""
+          }${props.required ? " *" : ""}`
+        }
+        invalid={invalid}
+        validationText={
+          invalid ? get(formState.errors, name)?.message : undefined
+        }
         ref={ref}
         id={id}
         type={props.type}
         required={props.required}
-        className="form-control"
         placeholder={props.placeholder}
         maxLength={props.maxLength}
         minLength={props.minLength}
@@ -69,11 +70,6 @@ const BaseInputWidget = (props) => {
           setCount(val.target.value.length);
         }}
       />
-      {invalid && (
-        <span className="help-block">
-          {get(formState.errors, name) && get(formState.errors, name).message}
-        </span>
-      )}
       {props.maxLength && (
         <Info description={count + "/" + props.maxLength + " chars used"} />
       )}
@@ -83,7 +79,7 @@ const BaseInputWidget = (props) => {
         }
         description={props.schema.description}
       />
-    </div>
+    </>
   );
 };
 
diff --git a/src/asset/style.scss b/src/asset/style.scss
index ad10b0e3..e9b45b6a 100644
--- a/src/asset/style.scss
+++ b/src/asset/style.scss
@@ -1,6 +1,8 @@
 $foot-bar-h: 100px;
 $mq-size: 640px;
 
+@use "bootstrap-italia/src/scss/bootstrap-italia";
+
 // We import CSS here rather than SCSS to avoid an annoying deprecation warning
 // from dart-sass.
 // See https://github.com/jquense/react-widgets/issues/1143.