diff --git a/packages/ui/form/AddressInput.tsx b/packages/ui/form/AddressInput.tsx
index 1dce80fa4e..1c331c87cb 100644
--- a/packages/ui/form/AddressInput.tsx
+++ b/packages/ui/form/AddressInput.tsx
@@ -1,3 +1,4 @@
+import { Input } from "../components/form/inputs/Input";
 import { MapPin } from "../components/icon";
 
 export type AddressInputProps = {
@@ -12,15 +13,14 @@ export type AddressInputProps = {
 function AddressInput({ className = "", value, onChange, ...rest }: AddressInputProps) {
   return (
     <div className="relative ">
-      <MapPin color="#D2D2D2" className="absolute top-1/2 left-0.5 ml-3 h-6 -translate-y-1/2" />
-      <input
+      <MapPin className="text-emphasis absolute top-1/2 left-0.5 ml-3 h-4 -translate-y-1/2" />
+      <Input
         {...rest}
         value={value}
         onChange={(e) => {
           onChange(e.target.value);
         }}
-        color="#D2D2D2"
-        className={`${className} focus-within:border-brand-default dark:bg-darkgray-100 border-subtle border-default disabled:text-subtle disabled:dark:text-subtle dark:text-inverted block  h-10 w-full rounded-md border border py-px pl-10 text-sm outline-none ring-black focus-within:ring-1 disabled:opacity-50 dark:placeholder-gray-500 dark:selection:bg-green-500`}
+        className={`${className} py-px pl-10`}
       />
     </div>
   );