diff --git a/packages/preact/src/utils/getElementInput.ts b/packages/preact/src/utils/getElementInput.ts
index 3d0c8de8..6dd6e278 100644
--- a/packages/preact/src/utils/getElementInput.ts
+++ b/packages/preact/src/utils/getElementInput.ts
@@ -39,7 +39,9 @@ export function getElementInput<
         ? [...((field.value.peek() || []) as string[]), value]
         : ((field.value.peek() || []) as string[]).filter((v) => v !== value)
       : type === 'number'
-      ? valueAsNumber
+      ? element instanceof HTMLSelectElement?
+                        value ? parseFloat(value) : undefined
+      : valueAsNumber
       : type === 'boolean'
       ? checked
       : type === 'File' && files
diff --git a/packages/qwik/src/utils/getElementInput.ts b/packages/qwik/src/utils/getElementInput.ts
index d8138423..48ea2ddd 100644
--- a/packages/qwik/src/utils/getElementInput.ts
+++ b/packages/qwik/src/utils/getElementInput.ts
@@ -40,7 +40,9 @@ export function getElementInput<
         ? [...((field.value || []) as string[]), value]
         : ((field.value || []) as string[]).filter((v) => v !== value)
       : type === 'number'
-      ? valueAsNumber
+      ? element instanceof HTMLSelectElement?
+                        value ? parseFloat(value) : undefined
+      : valueAsNumber
       : type === 'boolean'
       ? checked
       : type === 'File' && files
diff --git a/packages/react/src/utils/getElementInput.ts b/packages/react/src/utils/getElementInput.ts
index 3d0c8de8..6dd6e278 100644
--- a/packages/react/src/utils/getElementInput.ts
+++ b/packages/react/src/utils/getElementInput.ts
@@ -39,7 +39,9 @@ export function getElementInput<
         ? [...((field.value.peek() || []) as string[]), value]
         : ((field.value.peek() || []) as string[]).filter((v) => v !== value)
       : type === 'number'
-      ? valueAsNumber
+      ? element instanceof HTMLSelectElement?
+                        value ? parseFloat(value) : undefined
+      : valueAsNumber
       : type === 'boolean'
       ? checked
       : type === 'File' && files
diff --git a/packages/solid/src/utils/getElementInput.ts b/packages/solid/src/utils/getElementInput.ts
index 816f82f9..775d8934 100644
--- a/packages/solid/src/utils/getElementInput.ts
+++ b/packages/solid/src/utils/getElementInput.ts
@@ -20,7 +20,7 @@ import type {
  */
 export function getElementInput<
   TFieldValues extends FieldValues,
-  TFieldName extends FieldPath<TFieldValues>
+  TFieldName extends FieldPath<TFieldValues>,
 >(
   element: FieldElement,
   field: InternalFieldStore<TFieldValues, TFieldName>,
@@ -28,27 +28,42 @@ export function getElementInput<
 ): FieldPathValue<TFieldValues, TFieldName> {
   const { checked, files, options, value, valueAsDate, valueAsNumber } =
     element as HTMLInputElement & HTMLSelectElement & HTMLTextAreaElement;
-  return untrack(() =>
-    !type || type === 'string'
-      ? value
-      : type === 'string[]'
-      ? options
+  return untrack(() => {
+    if (!type || type === 'string') {
+      return value;
+    }
+    if (type === 'string[]') {
+      return options
         ? [...options]
             .filter((e) => e.selected && !e.disabled)
             .map((e) => e.value)
         : checked
-        ? [...((field.value.get() || []) as string[]), value]
-        : ((field.value.get() || []) as string[]).filter((v) => v !== value)
-      : type === 'number'
-      ? valueAsNumber
-      : type === 'boolean'
-      ? checked
-      : type === 'File' && files
-      ? files[0]
-      : type === 'File[]' && files
-      ? [...files]
-      : type === 'Date' && valueAsDate
-      ? valueAsDate
-      : field.value.get()
-  ) as FieldPathValue<TFieldValues, TFieldName>;
+          ? [...((field.value.get() || []) as string[]), value]
+          : ((field.value.get() || []) as string[]).filter((v) => v !== value);
+    }
+
+    if (type === 'number') {
+      if (element instanceof HTMLSelectElement) {
+        return value ? parseFloat(value) : undefined;
+      }
+
+      return valueAsNumber;
+    }
+
+    if (type === 'boolean') {
+      return checked;
+    }
+
+    if (type === 'File') {
+      return files ? files[0] : undefined;
+    }
+
+    if (type === 'File[]') {
+      return files ? [...files] : undefined;
+    }
+
+    if (type === 'Date') {
+      return valueAsDate;
+    }
+  }) as FieldPathValue<TFieldValues, TFieldName>;
 }
diff --git a/playgrounds/preact/src/components/Select.tsx b/playgrounds/preact/src/components/Select.tsx
index 0a38706c..787c07e5 100644
--- a/playgrounds/preact/src/components/Select.tsx
+++ b/playgrounds/preact/src/components/Select.tsx
@@ -7,14 +7,14 @@ import { AngleDownIcon } from '../icons';
 import { InputError } from './InputError';
 import { InputLabel } from './InputLabel';
 
-type SelectProps = {
+type SelectProps<T> = {
   name: string;
-  value: ReadonlySignal<string | string[] | null | undefined>;
+  value: ReadonlySignal<T | T[] | null | undefined>;
   ref: Ref<HTMLSelectElement>;
   onInput: JSX.GenericEventHandler<HTMLSelectElement>;
   onChange: JSX.GenericEventHandler<HTMLSelectElement>;
   onBlur: JSX.FocusEventHandler<HTMLSelectElement>;
-  options: { label: string; value: string }[];
+  options: { label: string; value: T }[];
   multiple?: boolean;
   size?: number;
   placeholder?: string;
@@ -29,7 +29,7 @@ type SelectProps = {
  * decorations can be displayed in or around the field to communicate the
  * entry requirements.
  */
-export const Select = forwardRef<HTMLSelectElement, SelectProps>(
+export const Select = forwardRef<HTMLSelectElement, SelectProps<string | number>>(
   ({ value, options, label, error, ...props }, ref) => {
     const { name, required, multiple, placeholder } = props;
 
@@ -37,7 +37,7 @@ export const Select = forwardRef<HTMLSelectElement, SelectProps>(
     const values = useComputed(() =>
       Array.isArray(value.value)
         ? value.value
-        : value.value && typeof value.value === 'string'
+      : (typeof props.value === 'string' || typeof props.value === 'number')
         ? [value.value]
         : []
     );
diff --git a/playgrounds/preact/src/routes/special.tsx b/playgrounds/preact/src/routes/special.tsx
index f7a8a7be..19729c11 100644
--- a/playgrounds/preact/src/routes/special.tsx
+++ b/playgrounds/preact/src/routes/special.tsx
@@ -20,6 +20,7 @@ type SpecialForm = {
   select: {
     array: string[];
     string: string;
+    number: number;
   };
   file: {
     list: File[];
@@ -130,6 +131,23 @@ export default function SpecialPage() {
           )}
         </Field>
 
+        <Field name="select.number" type="number">
+          {(field, props) => (
+            <Select
+              {...props}
+              value={field.value}
+              options={[
+                { label: 'Option 1', value: 1 },
+                { label: 'Option 2', value: 2 },
+                { label: 'Option 3', value: 3 },
+              ]}
+              error={field.error}
+              label="Select number"
+            />
+          )}
+        </Field>
+
+
         <Field name="file.list" type="File[]">
           {(field, props) => (
             <FileInput
diff --git a/playgrounds/qwik/src/components/Select.tsx b/playgrounds/qwik/src/components/Select.tsx
index c61a766f..e68d2939 100644
--- a/playgrounds/qwik/src/components/Select.tsx
+++ b/playgrounds/qwik/src/components/Select.tsx
@@ -4,14 +4,14 @@ import { AngleDownIcon } from '~/icons';
 import { InputError } from './InputError';
 import { InputLabel } from './InputLabel';
 
-type SelectProps = {
+type SelectProps<T> = {
   ref: QRL<(element: HTMLSelectElement) => void>;
   name: string;
-  value: string | string[] | null | undefined;
+  value: T | T[] | null | undefined;
   onInput$: (event: Event, element: HTMLSelectElement) => void;
   onChange$: (event: Event, element: HTMLSelectElement) => void;
   onBlur$: (event: Event, element: HTMLSelectElement) => void;
-  options: { label: string; value: string }[];
+  options: { label: string; value: T }[];
   multiple?: boolean;
   size?: number;
   placeholder?: string;
@@ -27,16 +27,16 @@ type SelectProps = {
  * entry requirements.
  */
 export const Select = component$(
-  ({ value, options, label, error, ...props }: SelectProps) => {
+  ({ value, options, label, error, ...props }: SelectProps<string | number>) => {
     const { name, required, multiple, placeholder } = props;
 
     // Create computed value of selected values
-    const values = useSignal<string[]>();
+    const values = useSignal<(string | number)[]>();
     useTask$(({ track }) => {
       track(() => value);
       values.value = Array.isArray(value)
         ? value
-        : value && typeof value === 'string'
+        : value && (typeof value === 'string' || typeof value === 'number')
         ? [value]
         : [];
     });
diff --git a/playgrounds/qwik/src/routes/(default)/special/index.tsx b/playgrounds/qwik/src/routes/(default)/special/index.tsx
index 566a5fe8..75044114 100644
--- a/playgrounds/qwik/src/routes/(default)/special/index.tsx
+++ b/playgrounds/qwik/src/routes/(default)/special/index.tsx
@@ -21,6 +21,7 @@ type SpecialForm = {
   select: {
     array: string[];
     string?: string;
+    number?: number;
   };
   file: {
     list: NoSerialize<File>[];
@@ -38,6 +39,7 @@ export const useFormLoader = routeLoader$<InitialValues<SpecialForm>>(() => ({
   select: {
     array: [],
     string: undefined,
+    number: undefined,
   },
   file: {
     list: [],
@@ -150,6 +152,22 @@ export default component$(() => {
           )}
         </Field>
 
+        <Field name="select.number" type="number">
+          {(field, props) => (
+            <Select
+              {...props}
+              value={field.value}
+              options={[
+                { label: 'Option 1', value: 1 },
+                { label: 'Option 2', value: 2 },
+                { label: 'Option 3', value: 3 },
+              ]}
+              error={field.error}
+              label="Select number"
+            />
+          )}
+        </Field>
+
         <Field name="file.list" type="File[]">
           {(field, props) => (
             <FileInput
diff --git a/playgrounds/qwik/src/routes/actions/special/index.tsx b/playgrounds/qwik/src/routes/actions/special/index.tsx
index 6f4ef7fd..bfac277e 100644
--- a/playgrounds/qwik/src/routes/actions/special/index.tsx
+++ b/playgrounds/qwik/src/routes/actions/special/index.tsx
@@ -34,6 +34,7 @@ const SpecialSchema = v.object({
   select: v.object({
     array: v.array(v.string()),
     string: v.optional(v.string()),
+    number: v.optional(v.number()),
   }),
   file: v.object({
     list: v.array(v.custom<NoSerialize<Blob>>(isBlob)),
@@ -53,6 +54,7 @@ const getInitFormValues = (): InitialValues<SpecialForm> => ({
   select: {
     array: [],
     string: undefined,
+    number: undefined,
   },
   file: {
     list: [],
@@ -206,6 +208,23 @@ export default component$(() => {
           )}
         </Field>
 
+        <Field name="select.number" type="number">
+          {(field, props) => (
+            <Select
+              {...props}
+              value={field.value}
+              options={[
+                { label: 'Option 1', value: 1 },
+                { label: 'Option 2', value: 2 },
+                { label: 'Option 3', value: 3 },
+              ]}
+              error={field.error}
+              label="Select number"
+            />
+          )}
+        </Field>
+
+
         <Field name="file.list" type="File[]">
           {(field, props) => (
             <FileInput
diff --git a/playgrounds/react/src/components/Select.tsx b/playgrounds/react/src/components/Select.tsx
index e5ab739c..f42a03d5 100644
--- a/playgrounds/react/src/components/Select.tsx
+++ b/playgrounds/react/src/components/Select.tsx
@@ -5,13 +5,13 @@ import { AngleDownIcon } from '../icons';
 import { InputError } from './InputError';
 import { InputLabel } from './InputLabel';
 
-type SelectProps = {
+type SelectProps<T> = {
   name: string;
-  value: ReadonlySignal<string | string[] | null | undefined>;
+  value: ReadonlySignal<T | T[] | null | undefined>;
   ref: Ref<HTMLSelectElement>;
   onChange: ChangeEventHandler<HTMLSelectElement>;
   onBlur: FocusEventHandler<HTMLSelectElement>;
-  options: { label: string; value: string }[];
+  options: { label: string; value: T }[];
   multiple?: boolean;
   size?: number;
   placeholder?: string;
@@ -26,9 +26,17 @@ type SelectProps = {
  * decorations can be displayed in or around the field to communicate the
  * entry requirements.
  */
-export const Select = forwardRef<HTMLSelectElement, SelectProps>(
+export const Select = forwardRef<HTMLSelectElement, SelectProps<string | number>>(
   ({ className, value, options, label, error, ...props }, ref) => {
     const { name, required, multiple, placeholder } = props;
+    // Create computed value of selected values
+    const values = Array.isArray(value.value)
+        ? value.value
+      : (typeof value === 'string' || typeof value === 'number')
+        ? [value]
+        : [];
+
+
     return (
       <div className={clsx('px-8 lg:px-10', className)}>
         <InputLabel name={name} label={label} required={required} />
@@ -42,10 +50,9 @@ export const Select = forwardRef<HTMLSelectElement, SelectProps>(
                 ? 'border-red-600/50 dark:border-red-400/50'
                 : 'border-slate-200 hover:border-slate-300 focus:border-sky-600/50 dark:border-slate-800 dark:hover:border-slate-700 dark:focus:border-sky-400/50',
               multiple ? 'py-5' : 'h-14 md:h-16 lg:h-[70px]',
-              placeholder && !value.value?.length && 'text-slate-500'
+              placeholder && !value.value && 'text-slate-500'
             )}
             id={name}
-            value={value.value || (multiple ? [] : '')}
             aria-invalid={!!error}
             aria-errormessage={`${name}-error`}
           >
@@ -53,7 +60,7 @@ export const Select = forwardRef<HTMLSelectElement, SelectProps>(
               {placeholder}
             </option>
             {options.map(({ label, value }) => (
-              <option key={value} value={value}>
+              <option key={value} value={value} selected={values?.includes(value)}>
                 {label}
               </option>
             ))}
diff --git a/playgrounds/react/src/routes/special.tsx b/playgrounds/react/src/routes/special.tsx
index 3d267ebf..049378a5 100644
--- a/playgrounds/react/src/routes/special.tsx
+++ b/playgrounds/react/src/routes/special.tsx
@@ -20,6 +20,7 @@ type SpecialForm = {
   select: {
     array: string[];
     string: string;
+    number: number;
   };
   file: {
     list: File[];
@@ -130,6 +131,23 @@ export default function SpecialPage() {
           )}
         </Field>
 
+        <Field name="select.number">
+          {(field, props) => (
+            <Select
+              {...props}
+              value={field.value}
+              options={[
+                { label: 'Option 1', value: 1 },
+                { label: 'Option 2', value: 2 },
+                { label: 'Option 3', value: 3 },
+              ]}
+              error={field.error}
+              label="Select string"
+            />
+          )}
+        </Field>
+
+
         <Field name="file.list" type="File[]">
           {(field, props) => (
             <FileInput
diff --git a/playgrounds/solid/src/components/Select.tsx b/playgrounds/solid/src/components/Select.tsx
index fa051fe8..4f435761 100644
--- a/playgrounds/solid/src/components/Select.tsx
+++ b/playgrounds/solid/src/components/Select.tsx
@@ -4,14 +4,14 @@ import { AngleDownIcon } from '~/icons';
 import { InputError } from './InputError';
 import { InputLabel } from './InputLabel';
 
-type SelectProps = {
+type SelectProps<T> = {
   ref: (element: HTMLSelectElement) => void;
   name: string;
-  value: string | string[] | undefined;
+  value: T | T[] | undefined;
   onInput: JSX.EventHandler<HTMLSelectElement, InputEvent>;
   onChange: JSX.EventHandler<HTMLSelectElement, Event>;
   onBlur: JSX.EventHandler<HTMLSelectElement, FocusEvent>;
-  options: { label: string; value: string }[];
+  options: { label: string; value: T }[];
   multiple?: boolean;
   size?: string | number;
   placeholder?: string;
@@ -26,7 +26,7 @@ type SelectProps = {
  * decorations can be displayed in or around the field to communicate the
  * entry requirements.
  */
-export function Select(props: SelectProps) {
+export function Select<T>(props: SelectProps<T>) {
   // Split select element props
   const [, selectProps] = splitProps(props, [
     'class',
@@ -40,7 +40,7 @@ export function Select(props: SelectProps) {
   const getValues = createMemo(() =>
     Array.isArray(props.value)
       ? props.value
-      : typeof props.value === 'string'
+      : (typeof props.value === 'string' || typeof props.value === 'number')
       ? [props.value]
       : []
   );
@@ -61,7 +61,7 @@ export function Select(props: SelectProps) {
               ? 'border-red-600/50 dark:border-red-400/50'
               : 'border-slate-200 hover:border-slate-300 focus:border-sky-600/50 dark:border-slate-800 dark:hover:border-slate-700 dark:focus:border-sky-400/50',
             props.multiple ? 'py-5' : 'h-14 md:h-16 lg:h-[70px]',
-            props.placeholder && !props.value?.length && 'text-slate-500'
+            props.placeholder && !props.value && 'text-slate-500'
           )}
           id={props.name}
           aria-invalid={!!props.error}
@@ -72,7 +72,7 @@ export function Select(props: SelectProps) {
           </option>
           <For each={props.options}>
             {({ label, value }) => (
-              <option value={value} selected={getValues().includes(value)}>
+              <option value={String(value)} selected={getValues().includes(value)}>
                 {label}
               </option>
             )}
diff --git a/playgrounds/solid/src/routes/special.tsx b/playgrounds/solid/src/routes/special.tsx
index fd157a26..e8f25909 100644
--- a/playgrounds/solid/src/routes/special.tsx
+++ b/playgrounds/solid/src/routes/special.tsx
@@ -21,6 +21,7 @@ type SpecialForm = {
   select: {
     array: string[];
     string: string;
+    number: number;
   };
   file: {
     list: File[];
@@ -138,6 +139,23 @@ export default function SpecialPage() {
             )}
           </Field>
 
+          <Field name="select.number" type="number">
+            {(field, props) => (
+              <Select
+                {...props}
+                value={field.value}
+                options={[
+                  { label: 'Option 1', value: 1},
+                  { label: 'Option 2', value: 2},
+                  { label: 'Option 3', value: 3},
+                ]}
+                error={field.error}
+                label="Select number"
+              />
+            )}
+          </Field>
+
+
           <Field name="file.list" type="File[]">
             {(field, props) => (
               <FileInput