Progress tracker

모든 플랫폼에서 최소 3개 이상 5개 이하의 단계를 안내합니다. 모바일에서는 한글 6자 이하의 Label 사용을 권장합니다.

모든 플랫폼에서 최소 2개 이상, 최대 5개 이하의 단계를 안내합니다. Label이 길거나 단계별 상세 정보가 많을 시 효과적으로 전달하기 위해서 사용합니다.

데스트톱에서 최소 3개 이상, 5개 이하의 단계를 안내합니다. 화면 전체에 단계 요소를 강조할 때 사용합니다.

Label 사용 시 짧고 간결한 6자 이하로 사용을 권장하며 Label이 길어질 때 적절한 여백을 두어 가독성을 확보합니다. 모바일, 데스크톱 모두 사용할 수 있으나 반응형 작업을 할 시 너비 360px을 기준으로 추가 보정 작업이 필요한지 확인하는 것을 권장합니다.

좁은 공간에서 단계별 상세 정보가 많은 경우 활용할 수 있습니다. 비교적 긴 Label을 수용할 수 있으며 확장성에 용이합니다. 단, 사용자가 단계를 인지하기에 부담스럽지 않아야 합니다.

화면 전체를 한 단계로 활용할 때 사용합니다. 상단 GNB에 고정되어 활용할 수 있으며 각 단계를 클릭하여 이전 단계를 스킵하거나 다음 단계를 미리 볼 수 있을 때 활용합니다.