BAEMIN 2.0 · 2024 · DARK
배달의민족
오늘도 가장 앞서 뜨겁게 달립니다. 한국 길거리 간판 미학을 디지털로 가져온 음식·생필품 슈퍼앱.
⚑ 다크 모드 토큰은 추정값입니다
services/baemin.md의 Known Gaps 절은 "다크 모드 토큰 미공개"를 명시하고 있습니다. 이 프리뷰의 다크 표면(bg-page · bg-surface · border 등)은 라이트 토큰을 토대로 재구성한 추정치이며, 우아한형제들이 공식 배포한 값이 아닙니다. 브랜드 민트 primary와 액센트 컬러는 라이트와 동일하게 유지했습니다.
브랜드 민트(#0CEFD3)와 액센트는 라이트와 동일하게 보존. 표면 토큰은 services/baemin.md에 미공개된 다크 표면을 추정으로 채웠다.
헤드라인은 1960~70년대 아크릴 컷팅 간판 모티브의 BM 한나체 시리즈, 본문은 Pretendard Variable. line-height 1.0~1.1로 좁고, 한 줄 4~7자 시처럼 라인 브레이크.
마케팅·앱·B마트·빈 상태 영역의 대표 패턴. 그라데이션 없음, 이모지 없음(일러스트 placeholder), 한국어 호칭 그대로.
배달의민족
워드마크는 한나체 5글자 그대로. 별도 심볼 마크 없음 · 2024 리브랜드 앱 아이콘은 민트 배경 + 흰 "배민".
로고 = 한나체 워드마크(타입 자체가 마크). 앱 아이콘 자산만 별도 SVG로 분리.
민트 풀 배경 + 흰 캡슐 입력창. placeholder는 "마법주문어" — 위트 카피 허용.
가게배달
가게에서 자체 배달
B마트
장보기도 더 빠르게!
배민스토어
배달은 지금 옵니다
로그인 직후 가장 먼저 만나는 핵심 도메인 내비. 14px radius + 1px 보더, 타이틀 800, 서브 11px/fg-3 2줄. 실제 앱은 3D 미니어처(여기선 placeholder).
고객님을 위해 준비한 할인 쿠폰
표면 카드 + 1.5px 민트 보더. 우측 64×44 오렌지 티켓 rotate(-4deg) + 스티커 그림자, 우상단 20px B코인 뱃지(검정 배경 + 민트 "B"). 오렌지 풀배경 배너와 구분되는 별도 패턴.
별은 별점 전용 골드 14px(포인트 코인보다 약간 어둡고 채도 낮음), 점수 13px/800, 회색 리뷰수는 한국어 수 표기 그대로(리뷰 999 · 1만+ · 9).
냉동 32px 원(파랑) · NEW 18px 핑크 pill · 민트틴트 분류 태그 · 핑크 아웃라인 태그(채움 대신 보더로 약한 강조). 가격·물류·분류 층위를 색으로 분리.
등급명을 한국어 형용사 호칭으로 노출. 영문 "Gold member"의 자리를 그대로 흡수한 시그니처 패턴.
실제 앱은 3D 미니어처 음식 렌더(Apple emoji 결을 닮은 배민 전용 자산). 이 프리뷰는 손그림 라인 stub.
좌상단 빨강 할인 칩, 좌하단 냉동 인디케이터, 우하단 + 추가 버튼. 가격은 800 weight + tabular-nums.
빨강 할인 / 민트 NEW / 보라 한그릇 / 냉동 원형. 그라데이션 금지, 모두 단색.
다크에선 표준 primary 알약을 밝은 표면 + 검정 텍스트로 반전. mint 버튼에 시그니처 sticker-shadow(6px 오프셋, blur 0) 적용.
자주 찾는 가게를 찜 해보세요
점토 한 글자 + 작은 회색 안내. 마케팅·찜 영역 전용 (지갑·포인트는 3D 굿즈로 분리).
색상 풀 배경 위 안내 — 검정 캡슐 + 흰 텍스트 90% opacity. 다크에서도 검정 유지(리터럴 잠금).
쿠폰함에서 확인하기
닉네임 호명 + 한나체 헤드라인 4~7자 라인 브레이크 그대로 적용.
활성 탭은 검정 채움 아이콘, 비활성은 stroke 2px 라인. 항상 5탭 고정.
⏱ 30~45분 무료배달
최소주문 14,000원
설정하신 주소 근처 가게만 보여요.
search-app-bar(back + 검색 + cart-badge) → tab-bar-scroll(active underline) → filter-chip-row(정렬·필터·드롭다운) → restaurant-row(썸네일 + rating + ETA + 무료배달 빨강 pill + club-mini-badge) → ad-banner-dark(검정 + 노랑 캐릭터) → empty-area-note. 시그니처 컴포넌트가 한 화면에 묶인다.