Text-iputs are usually used in forms and in the collection of information, in the format of text, that is entered by the user.

Anatomy

A. Input area

1. Leading Icon (optional)

2. Label/Placeholder

  1. User Input text

4. Icons (optional)

**B. Helper area** (optional)

https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FRilBAPbeSFcvhrnaqxSemB%2FTrustYou-UI---Components%3Fnode-id%3D960%253A33752

Specs

Inputs can consist of a simple box to just enter text, or it can be accompanied by one or two icons depending on the functionality.

https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FRilBAPbeSFcvhrnaqxSemB%2FTrustYou-UI---Components%3Fnode-id%3D960%253A33816

https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FRilBAPbeSFcvhrnaqxSemB%2FTrustYou-UI---Components%3Fnode-id%3D960%253A33787

Behaviour