Textarea
Textarea
Textarea
Textarea 컴포넌트는 여러 줄의 텍스트 입력이 가능한 필드입니다. Textfield와 달리 줄바꿈이 가능해서 사용자 의견 수렴, 피드백, 설명 작성 등 자유로운 서술이 필요한 입력 영역으로 활용됩니다.
Textarea
Textarea 컴포넌트는 여러 줄의 텍스트 입력이 가능한 필드입니다. Textfield와 달리 줄바꿈이 가능해서 사용자 의견 수렴, 피드백, 설명 작성 등 자유로운 서술이 필요한 입력 영역으로 활용됩니다.
Textarea
Textarea 컴포넌트는 여러 줄의 텍스트 입력이 가능한 필드입니다. Textfield와 달리 줄바꿈이 가능해서 사용자 의견 수렴, 피드백, 설명 작성 등 자유로운 서술이 필요한 입력 영역으로 활용됩니다.
Anatomy
ESSENTIAL
1. 입력 필드
사용자가 여러 줄의 텍스트를 입력할 수 있는 기본 입력 영역입니다. 설명, 의견, 소개글 등 서술형 콘텐츠를 작성할 때 사용합니다. 줄바꿈을 포함한 텍스트 입력을 지원하며 입력 내용의 길이에 따라 높이가 고정되거나 자동 확장될 수 있습니다.
OPTIONAL
2. 레이블 텍스트
Textarea가 어떤 내용을 입력받는지 설명하는 제목 역할의 텍스트입니다. 입력 영역 상단에 위치하여 사용자가 작성 목적을 명확히 이해하도록 돕습니다. 폼 맥락상 명확한 경우 생략할 수 있습니다.
3. 워드 리밋
입력 가능한 최대 글자 수 대비 현재 입력된 글자 수를 표시하는 영역입니다. 사용자가 작성 중 분량을 스스로 조절할 수 있도록 돕습니다. 최소 글자 수가 설정된 경우, 컬러 변경과 헬퍼 텍스트를 통해 현재 상태를 시각적으로 표현할 수 있습니다. (예: 최소 입력 글자 수 미달 시)
Anatomy
ESSENTIAL
1. 입력 필드
사용자가 여러 줄의 텍스트를 입력할 수 있는 기본 입력 영역입니다. 설명, 의견, 소개글 등 서술형 콘텐츠를 작성할 때 사용합니다. 줄바꿈을 포함한 텍스트 입력을 지원하며 입력 내용의 길이에 따라 높이가 고정되거나 자동 확장될 수 있습니다.
OPTIONAL
2. 레이블 텍스트
Textarea가 어떤 내용을 입력받는지 설명하는 제목 역할의 텍스트입니다. 입력 영역 상단에 위치하여 사용자가 작성 목적을 명확히 이해하도록 돕습니다. 폼 맥락상 명확한 경우 생략할 수 있습니다.
3. 워드 리밋
입력 가능한 최대 글자 수 대비 현재 입력된 글자 수를 표시하는 영역입니다. 사용자가 작성 중 분량을 스스로 조절할 수 있도록 돕습니다. 최소 글자 수가 설정된 경우, 컬러 변경과 헬퍼 텍스트를 통해 현재 상태를 시각적으로 표현할 수 있습니다. (예: 최소 입력 글자 수 미달 시)
Anatomy
ESSENTIAL
1. 입력 필드
사용자가 여러 줄의 텍스트를 입력할 수 있는 기본 입력 영역입니다. 설명, 의견, 소개글 등 서술형 콘텐츠를 작성할 때 사용합니다. 줄바꿈을 포함한 텍스트 입력을 지원하며 입력 내용의 길이에 따라 높이가 고정되거나 자동 확장될 수 있습니다.
OPTIONAL
2. 레이블 텍스트
Textarea가 어떤 내용을 입력받는지 설명하는 제목 역할의 텍스트입니다. 입력 영역 상단에 위치하여 사용자가 작성 목적을 명확히 이해하도록 돕습니다. 폼 맥락상 명확한 경우 생략할 수 있습니다.
3. 워드 리밋
입력 가능한 최대 글자 수 대비 현재 입력된 글자 수를 표시하는 영역입니다. 사용자가 작성 중 분량을 스스로 조절할 수 있도록 돕습니다. 최소 글자 수가 설정된 경우, 컬러 변경과 헬퍼 텍스트를 통해 현재 상태를 시각적으로 표현할 수 있습니다. (예: 최소 입력 글자 수 미달 시)
State
State
State
Properties
Word Limit | false, true |
Filled | false, true |
State | default, disabled, focused |
Size | L, S |
Properties
Word Limit | false, true |
Filled | false, true |
State | default, disabled, focused |
Size | L, S |
Properties
Word Limit | false, true |
Filled | false, true |
State | default, disabled, focused |
Size | L, S |
Spec
 | Customization레이블 텍스트는 옵션이며 숨길 수 있습니다. |
 | Height최소 높이(Min-height)는 2줄 이상 작성할 수 있는 정도로 설정해 주세요. |
Spec
Customization
레이블 텍스트는 옵션이며 숨길 수 있습니다.
최대 글자 수 설정값을 변경할 수 있으며 숨길 수 있습니다.
Height
최소 높이(Min-height)는 2줄 이상 작성할 수 있는 정도로 설정해 주세요.
Spec
| Customization레이블 텍스트는 옵션이며 숨길 수 있습니다. |
| Height최소 높이(Min-height)는 2줄 이상 작성할 수 있는 정도로 설정해 주세요. |
Usage
Do
충분한 내용을 입력받아야 할 경우, 원하는 수치의 높이로 설정해 고정시킬 수 있습니다.
Don't
Textfield와 오해하지 않도록 최소 3줄 이상의 높이를 설정해야 합니다.
Usage
Do
충분한 내용을 입력받아야 할 경우, 원하는 수치의 높이로 설정해 고정시킬 수 있습니다.
Don't
Textfield와 오해하지 않도록 최소 3줄 이상의 높이를 설정해야 합니다.
Usage
Do
충분한 내용을 입력받아야 할 경우, 원하는 수치의 높이로 설정해 고정시킬 수 있습니다.
Don't
Textfield와 오해하지 않도록 최소 3줄 이상의 높이를 설정해야 합니다.