From e8829a0bc7682953d7fd958e2d54ff240b1c8919 Mon Sep 17 00:00:00 2001
From: Hyungi Ahn <hyungiahn@Hyungiui-MacBookPro.local>
Date: Tue, 20 Jan 2026 08:52:40 +0900
Subject: [PATCH] =?UTF-8?q?docs:=20UI/UX=20=EB=94=94=EC=9E=90=EC=9D=B8=20?=
 =?UTF-8?q?=EA=B0=80=EC=9D=B4=EB=93=9C=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 이모지 사용 금지 정책 추가
- 모던하고 깔끔한 디자인 원칙 명시
- 색상 가이드 및 컴포넌트 구조 설명

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 CODING_GUIDE.md | 38 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/CODING_GUIDE.md b/CODING_GUIDE.md
index 1befa89..baa2c15 100644
--- a/CODING_GUIDE.md
+++ b/CODING_GUIDE.md
@@ -56,6 +56,44 @@ docker-compose up -d # 수동 실행
 
 ---
 
+## 🎨 UI/UX 디자인 가이드
+
+### 디자인 원칙
+- **모던하고 깔끔한 디자인**: 이모지 사용 지양, 아이콘 또는 심플한 텍스트 사용
+- **일관성**: 모든 페이지에서 동일한 디자인 시스템 적용
+- **컴포넌트 재사용**: navbar, footer 등은 컴포넌트로 관리
+
+### 이모지 사용 금지
+❌ **금지**:
+```html
+<!-- 나쁜 예 -->
+<button>📊 대시보드</button>
+<h1>🔧 작업 관리</h1>
+```
+
+✅ **권장**:
+```html
+<!-- 좋은 예 - 아이콘 라이브러리 사용 또는 심플한 텍스트 -->
+<button class="btn-primary">
+  <i class="icon-dashboard"></i>
+  대시보드
+</button>
+<h1>작업 관리</h1>
+```
+
+### 색상 가이드
+- **Primary**: 하늘색 계열 (`#0ea5e9`, `#38bdf8`, `#7dd3fc`)
+- **기본 배경**: 흰색/밝은 회색 계열
+- **텍스트**: `#1f2937` (dark gray)
+- **보조 텍스트**: `#6b7280` (medium gray)
+
+### 컴포넌트 구조
+- **네비게이션**: `web-ui/components/navbar.html` 참조
+- **일관된 헤더**: 모든 페이지에서 `<div id="navbar-container"></div>` 사용
+- **CSS 로딩 순서**: `design-system.css` → 페이지별 CSS
+
+---
+
 ## 📡 API 개발 가이드
 - **RESTful**: 명사형 리소스 사용 (`POST /users` O, `/createUser` X).
 - **응답 포맷**: