인터페이스 핵심 C · 업계 관례

Icon

아이콘

아이콘은 동작, 물건, 상태, 그룹을 알아보게 돕는 작은 기호예요.

당신은 이것을 이렇게 부를 수 있습니다 Icon기호글리프픽토그램

작동 방식을 확인하세요

원본 작업 예제아이콘

다른 예시

아이콘 옆에 '다운로드'라는 단어가 표시됩니다. 텍스트가 동작을 나타내므로 아이콘은 장식으로 표시됩니다.

주요 부분

  1. 01Trigger or task context
  2. 02Primary control surface
  3. 03Feedback, focus, and dismissal

사용할 때

한 가지 스타일의 친숙한 기호를 사용하세요. 눈에 보이는 텍스트나 접근 가능한 이름을 추가하세요.

다음 경우에는 사용하지 마세요

아이콘 스타일을 섞지 마세요. 이모지는 기기마다 달라질 수 있으므로 인터페이스 아이콘으로 사용하지 마세요. 익숙하지 않은 기호에는 라벨을 붙이세요.

코드에서 사용된 이름

SVG / Icon component

출시하기 전에

Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states.

복사 가능한 요청

Outcome:Complete the task with 아이콘 (Icon)。 User context:아이콘 옆에 '다운로드'라는 단어가 표시됩니다. 텍스트가 동작을 나타내므로 아이콘은 장식으로 표시됩니다. Recommended pattern:아이콘 (Icon)。 Why it fits:한 가지 스타일의 친숙한 기호를 사용하세요. 눈에 보이는 텍스트나 접근 가능한 이름을 추가하세요. Do not use it when:아이콘 스타일을 섞지 마세요. 이모지는 기기마다 달라질 수 있으므로 인터페이스 아이콘으로 사용하지 마세요. 익숙하지 않은 기호에는 라벨을 붙이세요. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary):하나의 공식 표준이 전체 용어를 통제하지 않음. 의미는 팀, 플랫폼 또는 프레임워크마다 달라질 수 있음. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.

이 요청을 확인하세요

Review how 아이콘 (Icon) is used now. Definition: 아이콘은 동작, 물건, 상태, 그룹을 알아보게 돕는 작은 기호예요. Release checks: Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.

C
이 용어는 얼마나 공식적인가요?

업계 관례

사람들은 직장에서 이 용어를 자주 사용합니다. 나열된 출처는 실습이나 제한을 지원할 수 있습니다. 모든 부분의 정의를 제공하지는 않습니다.

하나의 공식 표준이 전체 용어를 통제하지 않음. 의미는 팀, 플랫폼 또는 프레임워크마다 달라질 수 있음.

범위
소스가 포함하는 것만:정규 이름、정의、사용 안내、피해야 할 상황 안내
문서 상태
안정적인
선택됨
2026-07-30

증거 출처 및 범위

권위 있는 출처 · Apple · 안정적인 Human Interface Guidelines 범위: 정규 이름、정의、사용 안내、피해야 할 상황 안내 여기 역할: 정의가 아닌 유용한 배경 출처 범위: 정규 이름, 정의, 사용 안내, 피해야 할 상황 안내 권위 있는 출처 · Google · 안정적인 Material Design 3 범위: 정규 이름、정의、사용 안내、피해야 할 상황 안내 여기 역할: 정의가 아닌 유용한 배경 출처 범위: 정규 이름, 정의, 사용 안내, 피해야 할 상황 안내

직접 복사

브라우저가 이것을 복사할 수 없습니다. 아래 요청을 선택하고 직접 복사하세요.