Vega Logo
v1.0.0
Snackbar
스낵바(Snackbar)는 본문 외 정보 또는 주의, 강조형 정보로 필요 시 사용합니다. 모달에 비해 주의가 덜 필요한 피드백으로도 사용됩니다.
Anatomy
  1. 텍스트 레이블
  2. Container(선택)
  3. Left item(선택)
  4. Right item(선택)
Container
컨테이너는 보여지는 정보에 따라 색상을 변경하여 사용할 수 있습니다.
시스템 업데이트가 완료되어 정상적으로 서비스 이용 가능합니다.
오류입니다. 주소를 수정하여 다시 등록 바랍니다.
요청하신 사항이 적용 완료 되었습니다. 감사합니다.
Left item
왼쪽 아이템은 필요에 따라 아이콘, 아바타 또는 사진 사용이 가능합니다.
오류입니다. 주소를 수정하여 다시 등록 바랍니다.
김영희님의 사용자 등록이 완료되었습니다.
snackbar-image
test_alphacode.png 사진 등록이 완료되었습니다.
Right item
오른쪽 아이템은 필요에 따라 아이콘 또는 버튼으로 사용합니다.
완료 되었습니다.
지금 바로 확인해보세요!
시스템 업데이트가 완료되어 정상적으로 서비스 이용 가능합니다.
등록하신 사용자 정보에 수정이 필요합니다.
사용 가이드
중복 사용
동시에 두개 이상의 스낵바를 사용하지 않습니다. 필요한 경우 첫번째 스낵바가 사라진 후 두번째 스낵바가 표출되게 사용합니다.
시스템 업데이트가 완료되어 정상적으로 서비스 이용 가능합니다.
알파코드의 11월 이벤트가 시작되었습니다!
Don’t
위치 선정
스낵바의 위치가 중요한 정보를 가리지 않도록 주의합니다.
snack-bar
Do
snack-bar
Don’t