Skip to content

Text fields

기본적인 텍스트 필드의 구성요소

Text_fields-anatomy.jpeg

Container
사용자가 정보를 입력할 수 있는 인터렉션 영역
Input text
입력된 정보
Label Text
이 텍스트 필드가 어떤 정보를 입력하는지를 나타내는 지표.
Placeholder text
input text가 입력되기 전에 사용자들이 정보를 입력할 수 있게끔 임시로 채워져 있는 텍스트 (예를 들면 비밀번호 입력 란에 '비밀번호를 입력하세요'와 같은 palceholder text 가 사용될 수 있습니다). 실제로 사용자가 input text를 채워 넣으면 placeholder text는 사라집니다.
Helper or Validation text(선택사항)
정보 입력에 대한 추가 정보를 제공하거나, 입력한 정보가 기준에 부합하는지와 같은 기준을 제공하기도 합니다. 필수가 아니며 선택적으로 사용됩니다.
Leading icon(선택사항)
입력하는 정보를 뒷받침하는 아이콘입니다. 필수가 아니며 선택적으로 사용됩니다.
Trailing icon(선택사항)
입력된 정보에 대한 부가적인 기능을 담당합니다 (예를 들면 입력된 텍스트를 한 번에 지우기 위한 X아이콘, 비밀번호를 ***에서 텍스트로 보기 위한 눈알 아이콘이 사용될 수 있습니다).

See also

Favorite site