Border Width
요소 테두리의 두께를 정의하며, UI 계층과 시각적 구분을 표현합니다.
Border Scale
0px부터 8px까지 5단계 테두리 두께
border-00px
border-11px
border-22px
border-44px
border-88px
Visual Comparison
1pxborder-12pxborder-24pxborder-48pxborder-8Use Cases
각 컨텍스트별 권장 테두리 두께
자주 쓰는 패턴
테두리 요소
카드
border
1px
인풋
border
1px
포커스
border-2
2px
선택 상태
border-2
2px
액센트
border-l-4
4px
장식
border-b-8
8px
Examples
카드 테두리
border
border-2
액센트 테두리
border-l-2 - 가벼운 강조
border-l-4 - 중간 강조
border-l-8 - 강한 강조
상태 표시기
성공
경고
에러
정보