# 제이미성형외과 브랜드 컬러 & 타이포그래피 확장 가이드

> **분석 소스**: 초진 환자 안내서 2025 (Canva 제작물)  
> **분석일**: 2025-12-09  
> **버전**: v2.3

---

## 1. 확장 컬러 팔레트

### 1.1 기존 브랜드 컬러 (Primary - 유지)

| 컬러명 | HEX | RGB | CMYK | 용도 |
|--------|-----|-----|------|------|
| **Jamie Main Green** | #6D7856 | (109, 120, 86) | (9, 0, 28, 53) | 메인 브랜드 컬러, 로고 |
| **Jamie Green (Web)** | #79A233 | (121, 162, 51) | (25, 0, 69, 36) | 웹 링크, 강조, CTA |
| **Jamie Light Green** | #AFCC6D | (175, 204, 109) | (14, 0, 47, 20) | 버튼, 말풍선 |
| **Black** | #000000 | (0, 0, 0) | (0, 0, 0, 100) | 본문 텍스트 |
| **White** | #FFFFFF | (255, 255, 255) | (0, 0, 0, 0) | 버튼 텍스트, 밝은 배경 |

---

### 1.2 인쇄용 확장 컬러 (Print Extended) 🆕

#### 민트 그린 테마 (Mint Green Theme)
병원 인쇄물, 안내서, 브로슈어에 사용

| 컬러명 | HEX | RGB | CMYK | 용도 |
|--------|-----|-----|------|------|
| **Jamie Mint Light** | #DAEEE3 | (218, 238, 227) | (8, 0, 5, 7) | 메인 배경 |
| **Jamie Mint** | #D2EBDD | (210, 235, 221) | (11, 0, 6, 8) | 서브 배경, 카드 배경 |
| **Jamie Forest** | #568459 | (86, 132, 89) | (35, 0, 33, 48) | 타이틀, 강조 텍스트 |
| **Jamie Sage** | #8DAE92 | (141, 174, 146) | (19, 0, 16, 32) | 중간톤, 아이콘 |
| **Jamie Moss** | #B0C9B5 | (176, 201, 181) | (12, 0, 10, 21) | 서브 요소, 구분선 |

#### 블루 테마 (Blue Theme)
FAQ, 정보 섹션, 안내 페이지에 사용

| 컬러명 | HEX | RGB | CMYK | 용도 |
|--------|-----|-----|------|------|
| **Jamie Sky Light** | #C6D7E6 | (198, 215, 230) | (14, 7, 0, 10) | 메인 배경 |
| **Jamie Steel Blue** | #4C718B | (76, 113, 139) | (45, 19, 0, 45) | 타이틀, 강조 텍스트 |
| **Jamie Mist** | #8BA0AF | (139, 160, 175) | (21, 9, 0, 31) | 중간톤, 서브 텍스트 |
| **Jamie Cloud** | #A9C3D7 | (169, 195, 215) | (21, 9, 0, 16) | 서브 요소, 구분선 |

---

### 1.3 인쇄용 그라데이션 (Print Gradients) 🆕

#### 민트 그린 그라데이션
```css
/* CSS */
background: linear-gradient(135deg, #DAEEE3 0%, #D2EBDD 50%, #C8E5D6 100%);

/* 인쇄 적용 */
시작점: #DAEEE3 (C8 M0 Y5 K7)
중간점: #D2EBDD (C11 M0 Y6 K8)
끝점: #C8E5D6 (C13 M0 Y8 K10)
```

**용도**: 표지, 메인 비주얼, 안내서 배경

#### 블루 그라데이션
```css
/* CSS */
background: linear-gradient(135deg, #C6D7E6 0%, #B8CDE0 50%, #A9C3D7 100%);

/* 인쇄 적용 */
시작점: #C6D7E6 (C14 M7 Y0 K10)
중간점: #B8CDE0 (C18 M9 Y0 K12)
끝점: #A9C3D7 (C21 M9 Y0 K16)
```

**용도**: FAQ 섹션, 정보 안내 페이지

---

## 2. 타이포그래피 확장 가이드

### 2.1 서체 체계 🆕

| 용도 | 서체 | 웨이트 | 언어 |
|------|------|--------|------|
| **영문 로고** | Now | Regular | EN |
| **영문 본문** | DM Sans | Regular, Bold | EN |
| **국문 전체** | Noto Sans KR | Light, Regular, Medium, Bold | KO |

### 2.2 서체 상세

#### Now (영문 로고 전용)
- **용도**: "JAMIE", "JAMIE CLINIC" 워드마크
- **특징**: 현대적이고 깔끔한 산세리프, 기하학적 형태
- **웨이트**: Regular
- **출처**: 프리미엄 서체 (라이선스 확인 필요)

#### DM Sans (영문 본문)
- **용도**: 영문 태그라인, 부제목, 영문 안내문
- **특징**: 가독성 높은 기하학적 산세리프, Google Fonts 무료 제공
- **웨이트**: 
  - Regular (400) - 본문
  - Bold (700) - 강조, 제목
- **출처**: [Google Fonts](https://fonts.google.com/specimen/DM+Sans)

#### Noto Sans KR (국문 전체)
- **용도**: 모든 한글 텍스트
- **웨이트 활용**:
  - Light (300) - 긴 본문, 부가 설명
  - Regular (400) - 일반 본문
  - Medium (500) - 서브 타이틀
  - Bold (700) - 메인 타이틀, 강조

---

### 2.3 텍스트 스타일 가이드

#### 인쇄물 텍스트 스타일

| 요소 | 서체 | 크기 | 웨이트 | 자간 | 컬러 |
|------|------|------|--------|------|------|
| 메인 타이틀 (KO) | Noto Sans KR | 48-72pt | Bold | -60 | #568459 |
| 서브 타이틀 (KO) | Noto Sans KR | 24-36pt | Medium | -60 | #568459 |
| 본문 (KO) | Noto Sans KR | 14-18pt | Regular | -40 | #4A4949 |
| 캡션 (KO) | Noto Sans KR | 11-13pt | Light | -20 | #666666 |
| 로고 (EN) | Now | - | Regular | +50 | #6D7856 |
| 영문 타이틀 (EN) | DM Sans | 24-36pt | Bold | -20 | #568459 |
| 영문 본문 (EN) | DM Sans | 14-18pt | Regular | 0 | #4A4949 |

#### 웹 텍스트 스타일 (유지)

| 요소 | 서체 | 자간 | 행간 |
|------|------|------|------|
| 영문 텍스트 | DM Sans | -60 | 15.59pt |
| 타이틀 | Noto Sans KR | -60 | - |
| 소타이틀 | Noto Sans KR | -60 | 39pt |
| 라운드 네모박스 | Noto Sans KR | -60 | 31pt |
| 내용 텍스트 | Noto Sans KR | -60 | 26pt |

---

## 3. 테마별 적용 가이드

### 3.1 민트 그린 테마 적용

**적용 콘텐츠**: 
- 초진 환자 안내서
- 수술당일 프로세스
- 병원 소개 자료
- 브로슈어 표지

**컬러 조합**:
```
배경: #DAEEE3 (Jamie Mint Light)
카드 배경: #FFFFFF 또는 #D2EBDD
메인 타이틀: #568459 (Jamie Forest)
본문: #4A4949
강조 아이콘: #79A233 (Jamie Green)
구분선: #B0C9B5 (Jamie Moss)
```

### 3.2 블루 테마 적용

**적용 콘텐츠**:
- FAQ 페이지
- Q&A 섹션
- 주의사항 안내
- 정보성 콘텐츠

**컬러 조합**:
```
배경: #C6D7E6 (Jamie Sky Light)
카드 배경: #FFFFFF 또는 #A9C3D7
메인 타이틀: #4C718B (Jamie Steel Blue)
본문: #4A4949
서브 텍스트: #8BA0AF (Jamie Mist)
```

---

## 4. CSS 코드 스니펫

```css
/* === 민트 그린 테마 === */
.theme-mint {
    background: linear-gradient(135deg, #DAEEE3 0%, #D2EBDD 50%, #C8E5D6 100%);
}

.theme-mint .title {
    color: #568459;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 700;
    letter-spacing: -0.06em;
}

.theme-mint .body {
    color: #4A4949;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 400;
}

.theme-mint .accent {
    color: #79A233;
}

/* === 블루 테마 === */
.theme-blue {
    background: linear-gradient(135deg, #C6D7E6 0%, #B8CDE0 50%, #A9C3D7 100%);
}

.theme-blue .title {
    color: #4C718B;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 700;
    letter-spacing: -0.06em;
}

/* === 영문 서체 적용 === */
.logo-text {
    font-family: 'Now', sans-serif;
    letter-spacing: 0.05em;
    color: #6D7856;
}

.en-title {
    font-family: 'DM Sans', sans-serif;
    font-weight: 700;
}

.en-body {
    font-family: 'DM Sans', sans-serif;
    font-weight: 400;
}

/* === Google Fonts 임포트 === */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
```

---

## 5. 파일 요약

| 분석 소스 | 추출 정보 |
|-----------|-----------|
| 초진 환자 안내서 표지 | 민트 그린 그라데이션, Jamie Forest 타이틀 컬러 |
| 수술당일 프로세스 페이지 | 민트 테마 적용 예시, 원형 스텝 디자인 |
| FAQ 페이지 | 블루 테마 컬러 팔레트 |
| 전체 | DM Sans (영문), Now (로고), Noto Sans KR (국문) 서체 체계 |

---

## 6. Notion 브랜드가이드 업데이트 항목

### PART 2: VISUAL IDENTITY 추가 내용

1. **브랜드 컬러** 섹션
   - [x] 기존 Primary Colors 유지
   - [ ] Print Extended Colors 추가 (민트/블루 테마)
   - [ ] 인쇄용 CMYK 값 추가
   - [ ] 그라데이션 가이드 추가

2. **타이포그래피** 섹션
   - [ ] 서체 체계 확장 (Now, DM Sans 추가)
   - [ ] 인쇄물 텍스트 스타일 추가
   - [ ] 서체별 용도 명시

3. **CSS 적용 예시** 섹션
   - [ ] 민트/블루 테마 CSS 추가
   - [ ] Google Fonts 임포트 코드 추가

---

*이 문서는 Canva 제작 초진 환자 안내서 PDF 분석을 기반으로 작성되었습니다.*
