아이콘 (Icon)
v-icon 컴포넌트는 다양한 상황에서 쓸 수 있는 많은 glyphs(그림문자)를 제공합니다. Vuetify 아이콘들은 구글의 머티리얼 아이콘 폰트 라이브러리를 사용합니다. 사용가능한 모든 아이콘의 리스트를 보려면 공식 머티리얼 아이콘 페이지를 방문하세요.
API
컨트롤에 색상을 지정
다크 테마를 적용
인풋이 비활성화됨
큰 아이콘 (36px)
버튼 안에 쓰일 때 아이콘을 왼쪽으로 위치시킵니다.
라이트 테마를 적용
중간 크기 아이콘 (28px)
버튼 안의 아이콘을 오른쪽으로 위치시킵니다.
엘리먼트의 높이와 너비를 지정
작은 아이콘 (16px)
아주 큰 아이콘 (40px)
예제
폰트어썸 (Font Awesome)
폰트어썸(Font Awesome) 도 지원됩니다. 간단히 아이콘 이름 앞에 fa-를 붙이세요. 물론 폰트어썸 라이브러리를 프로젝트에 직접 include 해야한다는 걸 기억하세요.
머티리얼 디자인 아이콘 (Material Design Icons)
머티리얼 디자인 아이콘 역시 지원됩니다. 간단히 mdi-를 아이콘 이름앞에 붙이세요. 물론 MDI를 라이브러리를 프로젝트에 직접 include해야한다는 걸 기억하세요.
색상 Color
색상 헬퍼들을 이용하여 아이콘의 색을 기본적인 다크나 라이트 테마 이상으로 바꿀 수 있습니다.
버튼 (Buttons)
아이콘은 액션을 강조하기 위해 버튼 안에서도 사용될 수 있습니다.
Clickable
Binding any click event to v-icon will automatically change the cursor to a pointer.