diff --git a/src/leihs/inventory/client/components/basic_form_field.cljs b/src/leihs/inventory/client/components/basic_form_field.cljs
new file mode 100644
index 00000000..9d522f2d
--- /dev/null
+++ b/src/leihs/inventory/client/components/basic_form_field.cljs
@@ -0,0 +1,57 @@
+(ns leihs.inventory.client.components.basic-form-field
+  (:require
+   ["@@/checkbox" :refer [Checkbox]]
+   ["@@/dropzone" :refer [Dropzone]]
+   ["@@/form" :refer [FormField FormItem FormLabel FormControl FormDescription FormMessage]]
+   ["@@/input" :refer [Input]]
+   ["@@/textarea" :refer [Textarea]]
+   [leihs.inventory.client.lib.utils :refer [cj jc]]
+   [leihs.inventory.client.routes.models.create.components.accessories-list :refer [AccessoryList]]
+   [uix.core :as uix :refer [defui $]]))
+
+comment "available form fields"
+(def fields-map
+  {"input" Input
+   "dropzone" Dropzone
+   "textarea" Textarea
+   "checkbox" Checkbox
+   "accessory-list" AccessoryList})
+
+(defui main
+  "Main function for rendering a form field component.
+
+  Arguments:
+  - `control`: The control element for the form field.
+  - `input`: A map containing input properties.
+  - `class-name`: A string for additional CSS class names for the input field
+  - `label`: A boolean indicating whether to display the label.
+  - `description`: A boolean indicating whether to display the description.
+  - `name`: The name of the form field.
+
+  Default values:
+  - `label`: true
+  - `description`: true
+  - `class-name`: empty string
+  - `name`: The name from the `input` map."
+
+  [{:keys [control input class-name
+           label description name]
+    :or {label true description true
+         class-name "" name (:name input)}}]
+
+  (let [comp (get fields-map (:component input))]
+    (when comp
+      ($ FormField {:control (cj control)
+                    :name name
+                    :render #($ FormItem
+                                (when label ($ FormLabel (:label input)))
+                                ($ FormControl
+                                   ($ comp (merge
+                                            {:class-name class-name}
+                                            (:props input)
+                                            (:field (jc %)))))
+
+                                (when description ($ FormDescription
+                                                     ($ :<> (:description input))))
+
+                                ($ FormMessage))}))))
diff --git a/src/leihs/inventory/client/components/react/scrollspy/context.jsx b/src/leihs/inventory/client/components/react/scrollspy/context.jsx
index f7658124..ff6c9417 100644
--- a/src/leihs/inventory/client/components/react/scrollspy/context.jsx
+++ b/src/leihs/inventory/client/components/react/scrollspy/context.jsx
@@ -1,4 +1,4 @@
-import React, { useRef, useState } from "react"
+import React, { useState } from "react"
 
 // Create the context
 const ScrollspyContext = React.createContext()
@@ -10,9 +10,12 @@ export const ScrollspyProvider = ({ children }) => {
 
   // Function to add an item
   function addItem(item) {
-    if (items.find((i) => i.id === item.id)) return
-
-    setItems((prev) => [...prev, item])
+    setItems((prev) => {
+      if (prev.find((i) => i.id === item.id)) {
+        return [...prev]
+      }
+      return [...prev, item]
+    })
   }
 
   const value = {
diff --git a/src/leihs/inventory/client/components/react/scrollspy/scrollspy.jsx b/src/leihs/inventory/client/components/react/scrollspy/scrollspy.jsx
index 6b166d34..76a95657 100644
--- a/src/leihs/inventory/client/components/react/scrollspy/scrollspy.jsx
+++ b/src/leihs/inventory/client/components/react/scrollspy/scrollspy.jsx
@@ -7,7 +7,9 @@ import { cn } from "@@/utils"
 export function Scrollspy({ children, className }) {
   return (
     <ScrollspyProvider>
-      <div className={className + " scroll-smooth"}>{children}</div>
+      <div className={className + " scroll-smooth flex flex-col lg:flex-row"}>
+        {children}
+      </div>
     </ScrollspyProvider>
   )
 }
diff --git a/src/leihs/inventory/client/components/react/sortable-list/sortable-list.jsx b/src/leihs/inventory/client/components/react/sortable-list/sortable-list.jsx
index af71232d..6c29fcc8 100644
--- a/src/leihs/inventory/client/components/react/sortable-list/sortable-list.jsx
+++ b/src/leihs/inventory/client/components/react/sortable-list/sortable-list.jsx
@@ -38,17 +38,18 @@ function SortableList({ children, items, onDragEnd, setItems = false }) {
   )
 }
 
-function Draggable({ children, className, id, ...props }) {
+function Draggable({ children, className, id, asChild = false, ...props }) {
   const { transition, transform, setNodeRef } = useSortable({ id })
+  const Comp = asChild ? Slot : "div"
 
   const style = {
     transform: CSS.Transform.toString(transform),
     transition,
   }
   return (
-    <div style={style} {...props} ref={setNodeRef}>
+    <Comp style={style} {...props} ref={setNodeRef}>
       {children}
-    </div>
+    </Comp>
   )
 }
 
diff --git a/src/leihs/inventory/client/components/ui/form.jsx b/src/leihs/inventory/client/components/ui/form.jsx
index dcadc3e8..e9159ada 100644
--- a/src/leihs/inventory/client/components/ui/form.jsx
+++ b/src/leihs/inventory/client/components/ui/form.jsx
@@ -1,6 +1,11 @@
 import * as React from "react"
 import { Slot } from "@radix-ui/react-slot"
-import { Controller, FormProvider, useFormContext } from "react-hook-form"
+import {
+  Controller,
+  FormProvider,
+  useFormContext,
+  useFieldArray,
+} from "react-hook-form"
 
 import { cn } from "@/components/ui/utils"
 import { Label } from "@/components/ui/label"
@@ -9,6 +14,21 @@ const Form = FormProvider
 
 const FormFieldContext = React.createContext({})
 
+// const FormFields = ({ ...props }) => {
+//   const control = props.control;
+//
+//   const { fields, append, remove } = useFieldArray({
+//     control,
+//     name: ""
+//   });
+//
+//   return (
+//     <FormFieldContext.Provider value={{ name: props.name }}>
+//       <Controller name={} {...props} />
+//     </FormFieldContext.Provider>
+//   )
+// }
+
 const FormField = ({ ...props }) => {
   return (
     <FormFieldContext.Provider value={{ name: props.name }}>
diff --git a/src/leihs/inventory/client/components/ui/textarea.jsx b/src/leihs/inventory/client/components/ui/textarea.jsx
index c2bf2e01..736c6f69 100644
--- a/src/leihs/inventory/client/components/ui/textarea.jsx
+++ b/src/leihs/inventory/client/components/ui/textarea.jsx
@@ -2,18 +2,61 @@ import * as React from "react"
 
 import { cn } from "@/components/ui/utils"
 
-const Textarea = React.forwardRef(({ className, ...props }, ref) => {
-  return (
-    <textarea
-      className={cn(
-        "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-        className,
-      )}
-      ref={ref}
-      {...props}
-    />
-  )
-})
+const Textarea = React.forwardRef(
+  (
+    { className, autoscale = false, resize = true, onBlur, onFocus, ...props },
+    ref,
+  ) => {
+    const [isFocused, setIsFocused] = React.useState(false)
+    const textareaRef = React.useRef(null)
+
+    React.useImperativeHandle(ref, () => textareaRef.current)
+
+    const adjustHeight = () => {
+      const textarea = textareaRef.current
+      if (textarea) {
+        if (isFocused) {
+          textarea.style.height = "auto"
+          textarea.style.height = `${textarea.scrollHeight}px`
+        } else {
+          textarea.style.height = "2.5rem" // Set to 1 line height when not focused
+        }
+      }
+    }
+
+    React.useEffect(() => {
+      adjustHeight()
+    }, [props.value, isFocused])
+
+    function handleBlur(e) {
+      autoscale && setIsFocused(false)
+      onBlur && onBlur(e)
+    }
+
+    function handleFocus(e) {
+      autoscale && setIsFocused(true)
+      onFocus && onFocus(e)
+    }
+
+    return (
+      <textarea
+        ref={textareaRef}
+        style={{
+          height: autoscale ? textareaRef.current?.scrollHeight : undefined,
+        }}
+        onFocus={(e) => handleFocus(e)}
+        onBlur={(e) => handleBlur(e)}
+        className={cn(
+          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          autoscale && "overflow-hidden transition-all duration-200",
+          !props.resize && "resize-none",
+          className,
+        )}
+        {...props}
+      />
+    )
+  },
+)
 Textarea.displayName = "Textarea"
 
 export { Textarea }
diff --git a/src/leihs/inventory/client/routes/models/create/components/accessories_list.cljs b/src/leihs/inventory/client/routes/models/create/components/accessories_list.cljs
index 5e5e4dba..7bc8f10b 100644
--- a/src/leihs/inventory/client/routes/models/create/components/accessories_list.cljs
+++ b/src/leihs/inventory/client/routes/models/create/components/accessories_list.cljs
@@ -59,7 +59,7 @@
                     :on-change #(set-accessory! (.. % -target -value))
                     :on-blur (:onBlur props)
                     :aria-invalid (:aria-invalid props)
-                    :aria-describedby (::aria-describedby props)})
+                    :aria-describedby (:aria-describedby props)})
 
           ($ Button {:type "button"
                      :className ""
diff --git a/src/leihs/inventory/client/routes/models/create/components/model_properties.cljs b/src/leihs/inventory/client/routes/models/create/components/model_properties.cljs
new file mode 100644
index 00000000..73e1b67d
--- /dev/null
+++ b/src/leihs/inventory/client/routes/models/create/components/model_properties.cljs
@@ -0,0 +1,113 @@
+(ns leihs.inventory.client.routes.models.create.components.model-properties
+  (:require
+   ["@/components/react/sortable-list" :refer [SortableList Draggable DragHandle]]
+   ["@@/button" :refer [Button]]
+   ["@@/form" :refer [FormField FormItem FormControl FormMessage]]
+   ["@@/table" :refer [Table TableHeader TableRow TableHead TableBody TableCell]]
+   ["@@/textarea" :refer [Textarea]]
+   ["lucide-react" :refer [CirclePlus Trash]]
+   ["react-hook-form" :as hook-form]
+   [leihs.inventory.client.lib.utils :refer [cj jc]]
+   [uix.core :as uix :refer [defui $]]
+   [uix.dom]))
+
+(defn find-index-by-id [vec id]
+  (some (fn [[idx item]]
+          (when (= (:id item) id)
+            idx))
+        (map-indexed vector vec)))
+
+(defn handle-drag-end [event fields move]
+  (let [ev (jc event)]
+    (when-not (= (-> ev :over :id)
+                 (-> ev :active :id))
+
+      (let [old-index (find-index-by-id fields
+                                        (-> ev :active :id))
+            new-index (find-index-by-id fields
+                                        (-> ev :over :id))]
+
+        (move old-index new-index)))))
+
+(defui properties-table [{:keys [children inputs]}]
+  ($ Table
+     ($ TableHeader
+        ($ TableRow
+           ($ TableHead (-> inputs (nth 0) :label))
+           ($ TableHead (-> inputs (nth 1) :label))
+           ($ TableHead "Actions")))
+     ($ TableBody children)))
+
+(defui main [{:keys [control props]}]
+  (let [{:keys [fields append remove move]} (jc (hook-form/useFieldArray
+                                                 (cj {:control control
+                                                      :name "properties"})))
+        inputs (:inputs props)]
+
+    ($ :div {:className "flex flex-col gap-2"}
+
+       (when (not-empty fields)
+         ($ :div {:className "rounded-md border"}
+
+            ($ SortableList {:items (cj (map :id fields))
+                             :onDragEnd (fn [e] (handle-drag-end e fields move))}
+               ($ properties-table {:inputs inputs}
+                  (doall
+                   (map-indexed
+                    (fn [index field]
+                      ($ Draggable {:key (:id field)
+                                    :id (:id field)
+                                    :asChild true}
+
+                         ($ TableRow {:key (:id field)}
+
+                            ($ TableCell
+                               ($ FormField
+                                  {:control (cj control)
+                                   :name (str "properties." index (-> inputs (nth 0) :name))
+                                   :render #($ FormItem
+                                               ($ FormControl
+                                                  ($ Textarea (merge
+                                                               {:className "min-h-[2.5rem]"}
+                                                               (-> inputs (nth 0) :props)
+                                                               (:field (jc %))))))}
+
+                                  ($ FormMessage)))
+
+                            ($ TableCell
+                               ($ FormField
+                                  {:control (cj control)
+                                   :name (str "properties." index (-> inputs (nth 1) :name))
+                                   :render #($ FormItem
+                                               ($ FormControl
+                                                  ($ Textarea (merge
+                                                               {:className "min-h-[2.5rem]"}
+                                                               (-> inputs (nth 1) :props)
+                                                               (:field (jc %))))))}
+
+                                  ($ FormMessage)))
+
+                            ($ TableCell
+                               ($ :div {:className "ml-auto flex gap-2"}
+                                  ($ DragHandle {:id (:id field)
+                                                 :className "cursor-move"})
+
+                                  ($ Button {:variant "outline"
+                                             :size "icon"
+                                             :className "cursor-pointer"
+                                             :on-click #(remove index)}
+                                     ($ Trash {:className "p-1"})))))))
+                    fields))))))
+
+       ($ :div {:className "flex"}
+          ($ Button {:type "button"
+                     :className ""
+                     :variant "outline"
+                     :on-click #(append (cj {:name "" :value ""}))}
+
+             ($ CirclePlus {:className "p-1"}) "Eigenschaft hinzufügen")))))
+
+(def ModelProperties
+  (uix/as-react
+   (fn [props]
+     (main props))))
diff --git a/src/leihs/inventory/client/routes/models/create/fields.cljs b/src/leihs/inventory/client/routes/models/create/fields.cljs
new file mode 100644
index 00000000..1a4d3156
--- /dev/null
+++ b/src/leihs/inventory/client/routes/models/create/fields.cljs
@@ -0,0 +1,58 @@
+(ns leihs.inventory.client.routes.models.create.fields
+  (:require
+   ["@@/checkbox" :refer [Checkbox]]
+   ["@@/dropzone" :refer [Dropzone]]
+   ["@@/form" :refer [FormField FormItem FormLabel FormControl FormDescription FormMessage]]
+   ["@@/input" :refer [Input]]
+   ["@@/textarea" :refer [Textarea]]
+   [leihs.inventory.client.lib.utils :refer [cj jc]]
+   [leihs.inventory.client.routes.models.create.components.accessories-list :refer [AccessoryList]]
+   [leihs.inventory.client.routes.models.create.components.model-properties :refer [ModelProperties]]
+   [uix.core :as uix :refer [defui $]]))
+
+(def fields-map
+  {"input" Input
+   "dropzone" Dropzone
+   "textarea" Textarea
+   "checkbox" Checkbox
+   "accessory-list" AccessoryList})
+
+(defui field [{:keys [control block]}]
+  (cond
+    (-> block :component (= "model-properties"))
+    ($ ModelProperties {:control control
+                        :props (:props block)})
+
+    (-> block :input (= "checkbox"))
+    ($ FormField {:control (cj control)
+                  :name (:name block)
+                  :render #($ FormItem {:class-name "mt-6"}
+                              ($ FormControl
+                                 ($ Checkbox (merge
+                                              {:checked (-> (jc %) :field :value)
+                                               :onCheckedChange (-> (jc %) :field :onChange)}
+                                              (:props block))))
+
+                              ($ FormLabel {:className "pl-4"} (:label block))
+                              ($ FormDescription
+                                 ($ :<> (:description block)))
+
+                              ($ FormMessage))})
+
+    comment "default case - this renders a component from the component map"
+    :else
+    (let [comp (get fields-map (:input block))]
+      (when comp
+        ($ FormField {:control (cj control)
+                      :name (:name block)
+                      :render #($ FormItem {:class-name "mt-6"}
+                                  ($ FormLabel (:label block))
+                                  ($ FormControl
+                                     ($ comp (merge
+                                              (:props block)
+                                              (:field (jc %)))))
+
+                                  ($ FormDescription
+                                     ($ :<> (:description block)))
+
+                                  ($ FormMessage))})))))
diff --git a/src/leihs/inventory/client/routes/models/create/form.js b/src/leihs/inventory/client/routes/models/create/form.js
index 835ee0de..79c6b65a 100644
--- a/src/leihs/inventory/client/routes/models/create/form.js
+++ b/src/leihs/inventory/client/routes/models/create/form.js
@@ -8,6 +8,11 @@ const fileSchema = z.object({
     .regex(/^image\/(jpeg|png)$/, "Only JPEG and PNG files are allowed"),
 })
 
+const modelProperties = z.object({
+  name: z.string().min(5, "Eigenschaft muss mindestens 5 Zeichen lang sein"),
+  value: z.string().min(5, "Wert muss mindestens 5 Zeichen lang sein"),
+})
+
 export const schema = z.object({
   is_package: z.boolean().default(false),
   product: z.string().min(5, "Produktname muss mindestens 5 Zeichen lang sein"),
@@ -17,13 +22,13 @@ export const schema = z.object({
   technical_detail: z.string(),
   internal_description: z.string(),
   hand_over_note: z.string(),
-  entitlements: z.string().array(),
-  categories: z.string().array(),
+  // entitlements: z.string().array(),
+  // categories: z.string().array(),
   images: z.array(fileSchema).nonempty("Bitte mindestens ein Bild hochladen"),
   attachments: z.string().array(),
   accessories: z.string().array().optional(),
   model_links: z.string().array(),
-  properties: z.string().array(),
+  properties: z.array(modelProperties),
 })
 
 export const structure = [
@@ -33,129 +38,113 @@ export const structure = [
       {
         name: "is_package",
         label: "dies ist ein Paket?",
-        input: {
-          component: "checkbox",
-          props: { defaultChecked: false },
-        },
+        input: "checkbox",
+        props: { defaultChecked: false },
       },
       {
         name: "product",
         label: "Produkt",
         description: "Wie soll das Produkt heissen?",
-        input: {
-          component: "input",
-          props: {
-            placeholder: "Produktnamen eingeben",
-            "auto-complete": "off",
-          },
+        input: "input",
+        props: {
+          placeholder: "Produktnamen eingeben",
+          "auto-complete": "off",
         },
       },
       {
         name: "version",
         label: "Version",
         description: "Welche Version hat das Produkt?",
-        input: {
-          component: "input",
-          props: {
-            type: "number",
-            placeholder: "Version eingeben",
-            "auto-complete": "off",
-          },
+        input: "input",
+        props: {
+          type: "number",
+          placeholder: "Version eingeben",
+          "auto-complete": "off",
         },
       },
       {
         name: "manufacturer",
         label: "Hersteller",
         description: "Wer ist der Hersteller?",
-        input: {
-          component: "input",
-          props: {
-            placeholder: "Hersteller eingeben",
-            "auto-complete": "off",
-          },
+        input: "input",
+        props: {
+          placeholder: "Hersteller eingeben",
+          "auto-complete": "off",
         },
       },
       {
         name: "description",
         label: "Beschreibung",
         description: "Beschreiben Sie das Produkt",
-        input: {
-          component: "textarea",
-          props: {
-            placeholder: "Beschreibung eingeben",
-            "auto-complete": "off",
-          },
+        input: "textarea",
+        props: {
+          placeholder: "Beschreibung eingeben",
+          "auto-complete": "off",
         },
       },
       {
         name: "technical_detail",
         label: "Technische Details",
         description: "Geben Sie technische Details an",
-        input: {
-          component: "textarea",
-          porps: {
-            placeholder: "Technische Details eingeben",
-            "auto-complete": "off",
-          },
+        input: "textarea",
+        porps: {
+          placeholder: "Technische Details eingeben",
+          "auto-complete": "off",
         },
       },
       {
         name: "internal_description",
         label: "Interne Beschreibung",
         description: "Geben Sie eine interne Beschreibung an",
-        input: {
-          component: "textarea",
-          props: {
-            placeholder: "Interne Beschreibung eingeben",
-            "auto-complete": "off",
-          },
+        input: "textarea",
+        props: {
+          placeholder: "Interne Beschreibung eingeben",
+          "auto-complete": "off",
         },
       },
       {
         name: "hand_over_note",
         label: "Übergabevermerk",
         description: "Geben Sie einen Übergabevermerk an",
-        input: {
-          component: "textarea",
-          props: {
-            placeholder: "Übergabevermerk eingeben",
-            "auto-complete": "off",
-          },
-        },
-      },
-    ],
-  },
-  {
-    title: "Zuteilungen",
-    blocks: [
-      {
-        name: "entitlements",
-        label: "Berechtigungen",
-        description: "Listen Sie die Berechtigungen auf",
-        input: {
-          component: "combobox",
-          props: {
-            placeholder: "Berechtigungen eingeben",
-            "auto-complete": "off",
-          },
-        },
-      },
-    ],
-  },
-  {
-    title: "Kategorien",
-    blocks: [
-      {
-        name: "categories",
-        label: "Kategorien",
-        description: "Listen Sie die Kategorien auf",
-        input: {
-          component: "combobox",
-          props: { placeholder: "Kategorien eingeben", "auto-complete": "off" },
+        input: "textarea",
+        props: {
+          placeholder: "Übergabevermerk eingeben",
+          "auto-complete": "off",
         },
       },
     ],
   },
+  // {
+  //   title: "Zuteilungen",
+  //   blocks: [
+  //     {
+  //       name: "entitlements",
+  //       label: "Berechtigungen",
+  //       description: "Listen Sie die Berechtigungen auf",
+  //       input: {
+  //         component: "combobox",
+  //         props: {
+  //           placeholder: "Berechtigungen eingeben",
+  //           "auto-complete": "off",
+  //         },
+  //       },
+  //     },
+  //   ],
+  // },
+  // {
+  //   title: "Kategorien",
+  //   blocks: [
+  //     {
+  //       name: "categories",
+  //       label: "Kategorien",
+  //       description: "Listen Sie die Kategorien auf",
+  //       input: {
+  //         component: "combobox",
+  //         props: { placeholder: "Kategorien eingeben", "auto-complete": "off" },
+  //       },
+  //     },
+  //   ],
+  // },
   {
     title: "Bilder",
     blocks: [
@@ -163,13 +152,11 @@ export const structure = [
         name: "images",
         label: "Bilder",
         description: "Listen Sie die Bild-URLs auf",
-        input: {
-          component: "dropzone",
-          props: {
-            sortable: true,
-            multiple: true,
-            filetypes: "jpeg,png",
-          },
+        input: "dropzone",
+        props: {
+          sortable: true,
+          multiple: true,
+          filetypes: "jpeg,png",
         },
       },
     ],
@@ -181,13 +168,11 @@ export const structure = [
         name: "attachments",
         label: "Anhänge",
         description: "Listen Sie die Anhang-URLs auf",
-        input: {
-          component: "dropzone",
-          props: {
-            sortable: false,
-            multiple: true,
-            filetypes: "pdf",
-          },
+        input: "dropzone",
+        props: {
+          sortable: false,
+          multiple: true,
+          filetypes: "pdf",
         },
       },
     ],
@@ -199,12 +184,10 @@ export const structure = [
         name: "accessories",
         label: "Zubehör",
         description: "Listen Sie das Zubehör auf",
-        input: {
-          component: "accessory-list",
-          props: {
-            button: "Zubehör hinzufügen",
-            placeholder: "Zubehör eingeben",
-          },
+        input: "accessory-list",
+        props: {
+          button: "Zubehör hinzufügen",
+          placeholder: "Zubehör eingeben",
         },
       },
     ],
@@ -216,13 +199,11 @@ export const structure = [
         name: "model_links",
         label: "Modell-Links",
         description: "Listen Sie die Modell-Links auf",
-        input: {
-          component: "input",
-          props: {
-            type: "file",
-            placeholder: "Modell-Links eingeben",
-            "auto-complete": "off",
-          },
+        input: "input",
+        props: {
+          type: "file",
+          placeholder: "Modell-Links eingeben",
+          "auto-complete": "off",
         },
       },
     ],
@@ -231,16 +212,33 @@ export const structure = [
     title: "Eigenschaften",
     blocks: [
       {
-        name: "properties",
-        label: "Eigenschaften",
-        description: "Listen Sie die Eigenschaften auf",
-        input: {
-          component: "input",
-          props: {
-            type: "file",
-            placeholder: "Eigenschaften eingeben",
-            "auto-complete": "off",
-          },
+        name: "model-properties",
+        component: "model-properties",
+        props: {
+          inputs: [
+            {
+              name: "name",
+              label: "Eigenschaft",
+              component: "textarea",
+              props: {
+                autoscale: true,
+                resize: false,
+                placeholder: "Eigenschaft eingeben",
+                "auto-complete": "off",
+              },
+            },
+            {
+              name: "value",
+              label: "Wert",
+              component: "textarea",
+              props: {
+                autoscale: true,
+                resize: false,
+                placeholder: "Wert eingeben",
+                "auto-complete": "off",
+              },
+            },
+          ],
         },
       },
     ],
diff --git a/src/leihs/inventory/client/routes/models/create/page.cljs b/src/leihs/inventory/client/routes/models/create/page.cljs
index ca381063..fdae30ee 100644
--- a/src/leihs/inventory/client/routes/models/create/page.cljs
+++ b/src/leihs/inventory/client/routes/models/create/page.cljs
@@ -5,18 +5,12 @@
    ["@/routes/models/create/form" :refer [schema structure]]
    ["@@/button" :refer [Button]]
    ["@@/card" :refer [Card CardContent]]
-   ["@@/checkbox" :refer [Checkbox]]
-   ["@@/dropzone" :refer [Dropzone]]
-   ["@@/form" :refer [Form FormControl FormDescription FormField FormItem
-                      FormLabel FormMessage]]
-   ["@@/input" :refer [Input]]
-   ["@@/textarea" :refer [Textarea]]
-
+   ["@@/form" :refer [Form]]
    ["@hookform/resolvers/zod" :refer [zodResolver]]
    ["react-hook-form" :refer [useForm]]
    ["react-router-dom" :as router :refer [Link]]
    [leihs.inventory.client.lib.utils :refer [cj jc]]
-   [leihs.inventory.client.routes.models.create.components.accessories-list :refer [AccessoryList]]
+   [leihs.inventory.client.routes.models.create.fields :as form-fields]
    [uix.core :as uix :refer [$ defui]]
    [uix.dom]))
 
@@ -61,57 +55,9 @@
                            ($ :hr {:className "mb-4"})
 
                            (for [block (:blocks section)]
-                             ($ FormField {:control (cj control)
-                                           :key (:name block)
-                                           :name (:name block)
-                                           :render #($ FormItem {:class-name "mt-6"}
-                                                       (let [input (:input block)]
-                                                         (cond
-                                                           (-> input :component (= "input"))
-                                                           ($ FormLabel (:label block)
-                                                              ($ FormControl
-                                                                 ($ Input (merge
-                                                                           (:props input)
-                                                                           (:field (jc %))))))
-
-                                                           (-> input :component (= "dropzone"))
-                                                           ($ FormLabel (:label block)
-                                                              ($ FormControl
-                                                                 ($ Dropzone (merge
-                                                                              (:props input)
-                                                                              (:field (jc %))))))
-
-                                                           (-> input :component (= "accessory-list"))
-                                                           ($ FormLabel (:label block)
-                                                              ($ FormControl
-                                                                 ($ AccessoryList (merge
-                                                                                   (:props input)
-                                                                                   (:field (jc %))))))
-
-                                                           (-> input :component (= "textarea"))
-                                                           ($ FormLabel (:label block)
-                                                              ($ FormControl
-                                                                 ($ Textarea (merge
-                                                                              (:props input)
-                                                                              (:field (jc %))))))
-
-                                                           (-> input :component (= "checkbox"))
-                                                           ($ :<>
-                                                              ($ FormControl
-                                                                 ($ Checkbox (merge
-                                                                              {:checked (-> (jc %) :field :value)
-                                                                               :onCheckedChange (-> (jc %) :field :onChange)}
-                                                                              (:props input))))
-
-                                                              ($ FormLabel {:className "pl-4"} (:label block)))
-
-                                                           :else
-                                                           ($ :div "input type not implemented -> " (:component input))))
-
-                                                       ($ FormDescription
-                                                          ($ :<> (:description block)))
-
-                                                       ($ FormMessage))}))))))
+                             ($ form-fields/field {:key (:name block)
+                                                   :control control
+                                                   :block block}))))))
 
                 ($ :div {:className "h-max flex space-x-2 sticky top-[10vh]"}