인스타 속 그곳,
내 하루 코스로
가고 싶은 곳만 알려주세요. 동선·시간·예산은 Yeppi가 정리할게요.
팔레트 미리보기
검토용입니다. 고른 팔레트는 이 브라우저의 모든 화면에 적용되고 다른 사람에게는 보이지 않습니다. 링크에 ?palette=aqua-matcha 처럼 붙여 공유할 수 있습니다. 서비스 기본값은 Sunset Tangerine입니다.
색
Primitive → Semantic → Component 3계층. 컴포넌트는 semantic 이름만 씁니다.
Brand · 주요 행동 (CTA 600, 다크 CTA 400)
50
--brand-50
100
--brand-100
200
--brand-200
300
--brand-300
400
--brand-400
500
--brand-500
600
--brand-600
700
--brand-700
800
--brand-800
900
--brand-900
Highlight · 하이라이트 / Support · 보조 강조 / Paper · 배경
highlight
--highlight
hl-hover
--highlight-hover
hl-subtle
--highlight-subtle
hl-text
--highlight-text
support
--support
sp-subtle
--support-subtle
sp-text
--support-text
paper-50
--paper-50
paper-100
--paper-100
Navy · 다크 모드 배경
50
#eef3f6
200
#b9ccd8
400
#5f8099
700
#233f53
900
#122231
950
#0b1620
Neutral · Q2CUT 중립색
0
#ffffff
5
#fafafa
10
#f4f4f5
20
#e4e4e7
30
#d4d4d8
40
#a1a1aa
50
#71717a
60
#52525b
70
#3f3f46
80
#27272a
90
#18181b
100
#000000
Semantic (라이트/다크 자동 전환)
타이포그래피
Pretendard Variable · 자간 -0.02em · 제목 줄간격 130%, 본문 160%. 1024px 이상에서 PC 크기로 바뀝니다.
text-display
MO 32px · PC 48px
인스타 속 그곳, 내 코스로
text-h1
MO 26px · PC 36px
오늘의 서울 하루 코스
text-h2
MO 22px · PC 28px
추천 동선 3가지
text-h3
MO 18px · PC 22px
성수동 카페 거리
text-body-lg
MO 17px · PC 20px
취향과 예산에 맞춰 이동 순서를 정리했어요.
text-body
MO 15px · PC 16px
도보 12분 · 1인 예상 18,000원 · Walk 12 min
text-body-sm
MO 14px · PC 14px
영업시간은 방문 전 다시 확인하세요.
text-caption
MO 12px · PC 13px
사진 출처 · Wikimedia Commons CC BY-SA
선택 컨트롤
Q2CUT 선택 타일·칩 패턴. 선택 상태는 primary 테두리.
하루 분위기
동네
배지·안내
예상 시간과 비용은 참고용이에요
실제 요금·영업시간·막차는 방문 시점의 지도와 사업자 안내를 확인하세요.
상태 모음
와이어프레임 30. 화면마다 같은 모양으로 씁니다.
불러오지 못했어요
연결이 끊겼어요. 입력한 내용은 그대로 있어요.
오늘 찾기를 많이 했어요
장소 검색 한도에 닿았어요. 잠시 뒤에 다시 하거나, 추천 하루에서 골라 보세요.
오늘 무료 쇼츠를 다 썼어요
내일 다시 무료로 만들 수 있어요. 지금 만들려면 이 쇼츠만 업그레이드하거나 7일 패스를 써요.
다른 기기에서 바뀌었어요
최신으로 불러오거나, 내가 고친 것을 남길 수 있어요.
쇼츠 만드는 중
닫아도 계속돼요
아직 여행이 없어요
인스타에서 본 곳 하나로 시작해 볼까요?
코스 카드
모바일 가로 스크롤, PC 3열 그리드.
성수 카페 & 소품샵
5시간32,000원
경복궁 한복 산책
4시간45,000원
SM KWANGYA → 서울숲
3시간18,000원
간격·모서리·그림자
간격 (4px 단위)
모서리
sm
md
lg
xl
full
그림자
sm
md
lg