Reflex Logo
Docs Logo
Library

/

Forms

/

Input

/

Low

High Level

Low Level

A text field is an input field that users can type into. This component uses Radix's text field component.

The TextField component is used to capture user input and can include an optional slot for buttons and icons. It is based on the

element and supports common margin props.

Hello World!

Hello World!

The Less I Know

Rock

Breathe Deeper

Rock

Let It Happen

Rock

Borderline

Pop

Lost In Yesterday

Rock

Is It True

Rock

API Reference

rx.input

Captures user input with an optional slot for buttons and icons.

Test
PropType | ValuesDefaultInteractive
access_key
str
-
auto_capitalize
"off" | "none" | ...
-
content_editable
Union["inherit" | "plaintext-only", bool]
-
context_menu
str
-
dir
str
-
draggable
bool
-
enter_key_hint
"enter" | "done" | ...
-
hidden
bool
-
input_mode
"none" | "text" | ...
-
item_prop
str
-
lang
str
-
role
"alert" | "alertdialog" | ...
-
slot
str
-
spell_check
bool
-
tab_index
int
-
title
str
-
accept
str
-
alt
str
-
auto_complete
bool
-
auto_focus
bool
-
capture
Union["user" | "environment", bool]
-
checked
bool
-
default_checked
bool
-
default_value
str
-
disabled
bool
-
form
str
-
form_action
str
-
form_enc_type
str
-
form_method
str
-
form_no_validate
bool
-
form_target
str
-
list
str
-
max
Union[str, int, float]
-
max_length
int
-
min_length
int
-
min
Union[str, int, float]
-
multiple
bool
-
name
str
-
pattern
str
-
placeholder
str
-
read_only
bool
-
required
bool
-
size
"1" | "2" | ...
-
src
str
-
step
Union[str, int, float]
-
type
str
-
value
Union[str, int, float]
-
variant
"classic" | "surface" | ...
-
color_scheme
"tomato" | "red" | ...
-
radius
"none" | "small" | ...
-

Event Triggers

See the full list of default event triggers
TriggerDescription
on_key_downFired when a key is pressed down.
on_key_upFired when a key is released.
on_changeFired when the value of the textarea changes.

rx.input.slot

Contains icons or buttons associated with an Input.

PropType | ValuesDefaultInteractive
color_scheme
"tomato" | "red" | ...
-
side
"left" | "right"
-

Built with Reflex