diff --git a/assets/js/src/form_editor/components/font_size_settings.tsx b/assets/js/src/form_editor/components/font_size_settings.tsx
new file mode 100644
index 0000000000..beef345c79
--- /dev/null
+++ b/assets/js/src/form_editor/components/font_size_settings.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import {
+  FontSizePicker,
+} from '@wordpress/components';
+import { useSelect } from '@wordpress/data';
+
+type Props = {
+  name: string,
+  value: number|undefined
+  onChange: (value: string|undefined) => any
+}
+
+const FontSizeSettings = ({
+  name,
+  value,
+  onChange,
+}: Props) => {
+  const fontSizes = useSelect(
+    (select) => {
+      const { getSettings } = select('core/block-editor');
+      return getSettings().fontSizes;
+    },
+    []
+  );
+  return (
+    <div>
+      <h3 className="mailpoet-styles-settings-heading">
+        {name}
+      </h3>
+      <FontSizePicker
+        value={value}
+        onChange={onChange}
+        fontSizes={fontSizes}
+      />
+    </div>
+  );
+};
+
+export default FontSizeSettings;