당근마켓(당근)의 디자인 철학과 스타일을 반영한 design.md 초안입니다. 이 문서는 이후 Stitch를 활용한 프로토타입 제작 시 UI 일관성을 유지하는 가이드라인 역할을 합니다.Design System Specification: Danggeun Style이 문서는 당근의 사용자 경험과 디자인 언어를 기반으로 한 프로토타입 제작 가이드입니다. 모든 컴포넌트는 친근함, 신뢰, 간결함을 핵심 가치로 합니다.1. Color Palette당근의 아이덴티티인 ‘당근 오렌지’를 메인으로 사용합니다.RoleColor CodeDescriptionPrimary#FF8A3D브랜드 포인트 컬러Background#FFFFFF메인 배경색Surface#F8F9FA카드 및 섹션 배경Text Primary#212529주요 텍스트Text Secondary#868E96보조 텍스트/플레이스홀더Border#DEE2E6구분선 및 테두리2. Typography시스템 폰트는 OS 기본 서체(iOS: SF Pro, Android: Roboto)를 권장하며, 가독성을 최우선으로 합니다.Headline (Bold): 20px / Line-height: 1.5Body (Medium): 16px / Line-height: 1.5Caption (Regular): 14px / Line-height: 1.43. UI Components (Stitch Mapping)A. Button (Primary)Style: Full-width, Rounded (8px)Color: Primary (#FF8A3D)Text: White, BoldB. Input FieldStyle: Outlined, Rounded (8px)Border: 1px solid dee2e6focus: Border Color PrimaryC. Navigation BarHeight: 56pxBorder: Bottom line (1px solid dee2e6)Padding: 16px (Horizontal)4. Spacing & GridBase Spacing: 4px (Grid multiplier)Standard Margin: 16px (Screen edge)Component Gap: 12px5. Development Strategy (for Stitch)Stitch를 사용하여 프로토타입을 구현할 때 다음 규칙을 준수하세요:Note: 프로토타입은 ‘당근’ 특유의 여백(White Space)을 충분히 활용하여 시각적 피로도를 줄이는 방향으로 구성합니다.Atomic Design: 버튼, 인풋, 카드 등 작은 단위부터 스타일을 정의한 후 조립하세요.State Definition: 클릭 반응(Active), 비활성(Disabled) 상태에 대한 컬러 변수를 명확히 정의하세요.Layout: 모든 컨텐츠는 padding: 16px를 기본값으로 하여 정렬합니다.