diff --git a/crates/web/src/components/mod.rs b/crates/web/src/components/mod.rs
index 0da7996..5717f78 100644
--- a/crates/web/src/components/mod.rs
+++ b/crates/web/src/components/mod.rs
@@ -1,3 +1,4 @@
 mod helper;
 
 pub mod button;
+pub mod text_field;
diff --git a/crates/web/src/components/text_field.rs b/crates/web/src/components/text_field.rs
new file mode 100644
index 0000000..8b68282
--- /dev/null
+++ b/crates/web/src/components/text_field.rs
@@ -0,0 +1,16 @@
+use leptos::{component, view, IntoView};
+
+#[component]
+pub fn TextField(
+    #[prop(optional, into)] name: String,
+    #[prop(optional, into)] id: String,
+    #[prop(optional, into)] placeholder: String,
+    #[prop(optional, into)] value: String,
+    #[prop(optional, into, default = "text".to_string())] r#type: String,
+) -> impl IntoView {
+    view! {
+      <>
+      <input type=r#type name=name value=value id=id placeholder=placeholder class="p-5 w-full font-semibold text-black bg-black rounded" />
+      <>
+    }
+}
diff --git a/crates/web/src/views/home.rs b/crates/web/src/views/home.rs
index 1580c10..64a8f94 100644
--- a/crates/web/src/views/home.rs
+++ b/crates/web/src/views/home.rs
@@ -1,3 +1,4 @@
+use crate::components::text_field::TextField;
 use leptos::{component, view, IntoView};
 
 use crate::components::button::{Button, ButtonVariant};
@@ -11,6 +12,7 @@ pub fn Home() -> impl IntoView {
             <Button variant={ButtonVariant::Text}>{"Text"}</Button>
             <Button variant={ButtonVariant::Contained}>{"Contained"}</Button>
             <Button variant={ButtonVariant::Outlined}>{"Outlined"}</Button>
+            <TextField placeholder="hola" />
         </section>
     }
 }