SOCAR Frame 2.0 · 쏘카프레임
복잡함을 덜어내고 이동의 본질에 집중하는 화면.
역삼역 쏘카존 · 도보 3분
언제, 어디서 빌릴까요?
24개 컴포넌트가 쏘카 제품의 실제 흐름 위에서 보여야 한다.
ActionButton fill · outlined · state
Fill — primary / secondary / tertiary
Outlined — primary / secondary
State — pressed (92%) / loading / disabled
TextButton — primary / secondary / underline
IconButton & Badge circle · content · dot
IconButton — full circle, sm / md / lg
Badge — content / dot
Chip & Tag pill · label
Chip — selectable pill (radius 50px)
Tag — non-interactive label (radius 6px)
TopAppBar & Tab navigation
TopAppBar — min height 52px (max 3 trailing)
Tab — 2px sliding indicator (gray-800)
Accordion collapsible · radius-150
Status weak surface
Checkbox & Radio 20px · circular
SelectionBox radius-350 card · single · 틴트 (가정)
Input & TextArea filled · outlined · underline
Skeleton wave shimmer
BottomSheet detent · 24px
대여를 시작할까요?
Alert dialog · imperative
예약을 취소하시겠어요?
취소 수수료 3,000원이 발생합니다. 취소 후에는 복구할 수 없어요.
Date / Time range · wheel
Carousel track · pill dots
SegmentedControl toggle · count
2-up · count badge
3-up
Tips accent · info
AccentTip · purple
최대 30% 할인 중InfoTip · dark
면책금은 사고 시 본인 부담 한도입니다Snackbar transient bottom toast