diff --git a/app/components/index.ts b/app/components/index.ts
index d6886a32..60742bd0 100644
--- a/app/components/index.ts
+++ b/app/components/index.ts
@@ -1,3 +1,41 @@
+export {
+	Button,
+	buttonVariants,
+	type ButtonProps,
+	Checkbox,
+	type CheckboxProps,
+	DropdownMenu,
+	DropdownMenuTrigger,
+	DropdownMenuContent,
+	DropdownMenuItem,
+	DropdownMenuCheckboxItem,
+	DropdownMenuRadioItem,
+	DropdownMenuLabel,
+	DropdownMenuSeparator,
+	DropdownMenuShortcut,
+	DropdownMenuGroup,
+	DropdownMenuPortal,
+	DropdownMenuSub,
+	DropdownMenuSubContent,
+	DropdownMenuSubTrigger,
+	DropdownMenuRadioGroup,
+	Input,
+	type InputProps,
+	Label,
+	Textarea,
+	type TextareaProps,
+	Tooltip,
+	TooltipTrigger,
+	TooltipContent,
+	TooltipProvider,
+	CheckboxField,
+	Errors,
+	ErrorList,
+	type ListOfErrors,
+	Field,
+	TextareaField,
+} from '@pppaaattt/goodui'
+
 export * from './ui/index.ts'
 export * from './layout/index.ts'
 export * from './templates/index.ts'
diff --git a/app/components/ui/custom/field.tsx b/app/components/ui/custom/field.tsx
deleted file mode 100644
index 2108c7d2..00000000
--- a/app/components/ui/custom/field.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React, { useId } from 'react'
-import {
-	Input,
-	Label,
-	Errors,
-	type ListOfErrors,
-} from '#app/components/index.ts'
-
-export function Field({
-	labelProps,
-	inputProps,
-	errors,
-	className,
-}: {
-	labelProps: React.LabelHTMLAttributes<HTMLLabelElement>
-	inputProps: React.InputHTMLAttributes<HTMLInputElement>
-	errors?: ListOfErrors
-	className?: string
-}) {
-	const fallbackId = useId()
-	const id = inputProps.id ?? fallbackId
-	const errorId = errors?.length ? `${id}-error` : undefined
-	return (
-		<div className={className}>
-			<Label htmlFor={id} {...labelProps} />
-			<Input
-				id={id}
-				aria-invalid={errorId ? true : undefined}
-				aria-describedby={errorId}
-				{...inputProps}
-			/>
-			<Errors errorId={errorId} errors={errors} />
-		</div>
-	)
-}
diff --git a/app/components/ui/custom/index.ts b/app/components/ui/custom/index.ts
index f5afa671..0db267ab 100644
--- a/app/components/ui/custom/index.ts
+++ b/app/components/ui/custom/index.ts
@@ -1,6 +1,6 @@
-export * from './checkbox-field.tsx'
-export * from './errors.tsx'
-export * from './field.tsx'
+// export * from './checkbox-field.tsx'
+// export * from './errors.tsx'
+// export * from './field.tsx'
 export * from './icon.tsx'
 export * from './status-button.tsx'
-export * from './textarea-field.tsx'
+// export * from './textarea-field.tsx'
diff --git a/app/components/ui/index.ts b/app/components/ui/index.ts
index 47a8ebb0..66d3b202 100644
--- a/app/components/ui/index.ts
+++ b/app/components/ui/index.ts
@@ -1,2 +1,2 @@
+// export * from './primitives/index.ts'
 export * from './custom/index.ts'
-export * from './primitives/index.ts'
diff --git a/app/components/ui/primitives/button.tsx b/app/components/ui/primitives/button.tsx
index 761050bb..2934f0ea 100644
--- a/app/components/ui/primitives/button.tsx
+++ b/app/components/ui/primitives/button.tsx
@@ -1,58 +1,60 @@
-import { Slot } from '@radix-ui/react-slot'
-import { cva, type VariantProps } from 'class-variance-authority'
-import * as React from 'react'
+// if I delete this file the buttons won't work, commenting out works fine ',:|
 
-import { cn } from '#app/utils/misc.tsx'
+// import { Slot } from '@radix-ui/react-slot'
+// import { cva, type VariantProps } from 'class-variance-authority'
+// import * as React from 'react'
 
-const buttonVariants = cva(
-	'inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors outline-none focus-visible:ring-4 focus-within:ring-4 ring-ring ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
-	{
-		variants: {
-			variant: {
-				default: 'bg-primary text-primary-foreground hover:bg-primary/80',
-				destructive:
-					'bg-destructive text-destructive-foreground hover:bg-destructive/80',
-				outline:
-					'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
-				secondary:
-					'bg-secondary text-secondary-foreground hover:bg-secondary/80',
-				ghost: 'hover:bg-accent hover:text-accent-foreground',
-				link: 'text-primary underline-offset-4 hover:underline',
-			},
-			size: {
-				default: 'h-10 px-4 py-2',
-				wide: 'px-24 py-5',
-				sm: 'h-9 rounded-md px-3',
-				lg: 'h-11 rounded-md px-8',
-				pill: 'px-12 py-3 leading-3',
-				icon: 'h-10 w-10',
-			},
-		},
-		defaultVariants: {
-			variant: 'default',
-			size: 'default',
-		},
-	},
-)
+// import { cn } from '#app/utils/misc.tsx'
 
-export interface ButtonProps
-	extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-		VariantProps<typeof buttonVariants> {
-	asChild?: boolean
-}
+// const buttonVariants = cva(
+// 	'inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors outline-none focus-visible:ring-4 focus-within:ring-4 ring-ring ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
+// 	{
+// 		variants: {
+// 			variant: {
+// 				default: 'bg-primary text-primary-foreground hover:bg-primary/80',
+// 				destructive:
+// 					'bg-destructive text-destructive-foreground hover:bg-destructive/80',
+// 				outline:
+// 					'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+// 				secondary:
+// 					'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+// 				ghost: 'hover:bg-accent hover:text-accent-foreground',
+// 				link: 'text-primary underline-offset-4 hover:underline',
+// 			},
+// 			size: {
+// 				default: 'h-10 px-4 py-2',
+// 				wide: 'px-24 py-5',
+// 				sm: 'h-9 rounded-md px-3',
+// 				lg: 'h-11 rounded-md px-8',
+// 				pill: 'px-12 py-3 leading-3',
+// 				icon: 'h-10 w-10',
+// 			},
+// 		},
+// 		defaultVariants: {
+// 			variant: 'default',
+// 			size: 'default',
+// 		},
+// 	},
+// )
 
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-	({ className, variant, size, asChild = false, ...props }, ref) => {
-		const Comp = asChild ? Slot : 'button'
-		return (
-			<Comp
-				className={cn(buttonVariants({ variant, size, className }))}
-				ref={ref}
-				{...props}
-			/>
-		)
-	},
-)
-Button.displayName = 'Button'
+// export interface ButtonProps
+// 	extends React.ButtonHTMLAttributes<HTMLButtonElement>,
+// 		VariantProps<typeof buttonVariants> {
+// 	asChild?: boolean
+// }
 
-export { Button, buttonVariants }
+// const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+// 	({ className, variant, size, asChild = false, ...props }, ref) => {
+// 		const Comp = asChild ? Slot : 'button'
+// 		return (
+// 			<Comp
+// 				className={cn(buttonVariants({ variant, size, className }))}
+// 				ref={ref}
+// 				{...props}
+// 			/>
+// 		)
+// 	},
+// )
+// Button.displayName = 'Button'
+
+// export { Button, buttonVariants }
diff --git a/app/components/ui/primitives/index.ts b/app/components/ui/primitives/index.ts
index b6cda67b..18240461 100644
--- a/app/components/ui/primitives/index.ts
+++ b/app/components/ui/primitives/index.ts
@@ -1,7 +1,7 @@
-export * from './button.tsx'
-export * from './checkbox.tsx'
-export * from './dropdown-menu.tsx'
-export * from './input.tsx'
-export * from './label.tsx'
-export * from './textarea.tsx'
-export * from './tooltip.tsx'
+// export * from './button.tsx'
+// export * from './checkbox.tsx'
+// export * from './dropdown-menu.tsx'
+// export * from './input.tsx'
+// export * from './label.tsx'
+// export * from './textarea.tsx'
+// export * from './tooltip.tsx'
diff --git a/app/components/ui/primitives/input.tsx b/app/components/ui/primitives/input.tsx
deleted file mode 100644
index 18801dca..00000000
--- a/app/components/ui/primitives/input.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import * as React from 'react'
-
-import { cn } from '#app/utils/misc.tsx'
-
-export interface InputProps
-	extends React.InputHTMLAttributes<HTMLInputElement> {}
-
-const Input = React.forwardRef<HTMLInputElement, InputProps>(
-	({ className, type, ...props }, ref) => {
-		return (
-			<input
-				type={type}
-				className={cn(
-					'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium 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 aria-[invalid]:border-input-invalid',
-					className,
-				)}
-				ref={ref}
-				{...props}
-			/>
-		)
-	},
-)
-Input.displayName = 'Input'
-
-export { Input }
diff --git a/package-lock.json b/package-lock.json
index cf1144e5..011f7f5b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "@epic-web/totp": "^1.1.1",
         "@nasa-gcn/remix-seo": "^2.0.0",
         "@paralleldrive/cuid2": "^2.2.2",
+        "@pppaaattt/goodui": "^0.0.16",
         "@prisma/client": "^5.3.1",
         "@radix-ui/react-checkbox": "^1.0.4",
         "@radix-ui/react-dropdown-menu": "^2.0.6",
@@ -1981,6 +1982,30 @@
         "node": ">=16"
       }
     },
+    "node_modules/@pppaaattt/goodui": {
+      "version": "0.0.16",
+      "resolved": "https://registry.npmjs.org/@pppaaattt/goodui/-/goodui-0.0.16.tgz",
+      "integrity": "sha512-yQU31pAeqwBPFQaD74Aq7m4Y38MBoaK2soOPSVQJVJUMU/h4fiQkoldQwD8/C3k39fXsQtzbXPI64Lg7S+JwvQ==",
+      "dependencies": {
+        "@conform-to/react": "^0.9.0",
+        "@radix-ui/react-checkbox": "^1.0.4",
+        "@radix-ui/react-dropdown-menu": "^2.0.6",
+        "@radix-ui/react-label": "^2.0.2",
+        "@radix-ui/react-slot": "^1.0.2",
+        "@radix-ui/react-tooltip": "^1.0.7",
+        "class-variance-authority": "^0.7.0",
+        "lucide-react": "^0.284.0"
+      },
+      "peerDependencies": {
+        "clsx": "^2.0.0",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "tailwind-merge": "^1.14.0",
+        "tailwindcss": "^3.3.3",
+        "tailwindcss-animate": "^1.0.7",
+        "tailwindcss-radix": "^2.8.0"
+      }
+    },
     "node_modules/@prisma/client": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@prisma/client/-/client-5.3.1.tgz",
@@ -12056,6 +12081,14 @@
         "node": "14 || >=16.14"
       }
     },
+    "node_modules/lucide-react": {
+      "version": "0.284.0",
+      "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.284.0.tgz",
+      "integrity": "sha512-dVSMHYAya/TeY3+vsk+VQJEKNQN2AhIo0+Dp09B2qpzvcBuu93H98YZykFcjIAfmanFiDd8nqfXFR38L757cyQ==",
+      "peerDependencies": {
+        "react": "^16.5.1 || ^17.0.0 || ^18.0.0"
+      }
+    },
     "node_modules/lz-string": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
diff --git a/package.json b/package.json
index fbfdc546..b94d5cf4 100644
--- a/package.json
+++ b/package.json
@@ -48,6 +48,7 @@
     "@epic-web/totp": "^1.1.1",
     "@nasa-gcn/remix-seo": "^2.0.0",
     "@paralleldrive/cuid2": "^2.2.2",
+    "@pppaaattt/goodui": "^0.0.16",
     "@prisma/client": "^5.3.1",
     "@radix-ui/react-checkbox": "^1.0.4",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
@@ -164,4 +165,4 @@
   "prisma": {
     "seed": "tsx prisma/seed.ts"
   }
-}
\ No newline at end of file
+}