# 프롬프트 치트시트

Antigravity에서 바로 복사해서 쓸 수 있는 프롬프트 모음입니다.

---

## 기본 원칙

```
❌ 모호하게 → "좀 바꿔줘", "이상해", "예쁘게 해줘"
✅ 구체적으로 → 어디를, 어떻게, 얼마나
```

---

## 레이아웃

| 원하는 것 | 프롬프트 |
|----------|---------|
| 2열 그리드 | "프로젝트 섹션을 2열 그리드로 바꿔줘" |
| 3열 그리드 | "스킬 섹션을 3열 그리드로 배치해줘" |
| 1열 세로 | "프로젝트를 세로로 하나씩 풀사이즈로 보여줘" |
| 좌우 분할 | "왼쪽에 텍스트, 오른쪽에 이미지 배치해줘" |
| 센터 정렬 | "Hero 섹션을 가운데 정렬해줘" |
| 전체 화면 | "Hero를 화면 전체 크기(100vh)로 만들어줘" |
| 카드 형태 | "프로젝트를 카드 형태로 바꿔줘, 둥근 모서리에 그림자 넣어줘" |

---

## 색상

| 원하는 것 | 프롬프트 |
|----------|---------|
| 배경 변경 | "배경색을 #0a0a0a로 바꿔줘" |
| 강조색 변경 | "강조색을 파란색(#3B82F6)으로 바꿔줘" |
| 텍스트 색 | "본문 텍스트를 회색(#999)으로 바꿔줘" |
| 그라데이션 | "Hero 배경을 #0a0a0a에서 #1a1a2e 그라데이션으로" |
| 밝은 테마 | "전체를 밝은 배경(#ffffff)으로 바꿔줘, 텍스트는 검정" |
| 다크 테마 | "전체를 어두운 배경(#0a0a0a)으로 바꿔줘, 텍스트는 흰색" |

---

## 폰트 & 타이포그래피

| 원하는 것 | 프롬프트 |
|----------|---------|
| 한글 폰트 | "본문 폰트를 Pretendard로 바꿔줘" |
| 세리프 제목 | "제목을 세리프체(Noto Serif KR)로 바꿔줘" |
| 크기 변경 | "Hero 제목을 더 크게 해줘, 72px 이상" |
| 굵기 변경 | "제목을 더 굵게(Bold 700)로 해줘" |
| 줄간격 | "본문 줄간격을 1.8로 넓혀줘" |
| 자간 | "제목 자간을 -0.02em으로 좁혀줘" |

---

## 여백 & 간격

| 원하는 것 | 프롬프트 |
|----------|---------|
| 섹션 간격 | "섹션 사이 간격을 더 넓혀줘, 120px 정도" |
| 카드 간격 | "카드 사이 간격을 24px에서 48px로 넓혀줘" |
| 내부 여백 | "카드 안쪽 여백(padding)을 32px로 늘려줘" |
| 좌우 여백 | "콘텐츠 좌우 여백을 더 넓혀줘" |
| 여백 줄이기 | "Hero와 About 사이 간격을 줄여줘" |

---

## 애니메이션 & 인터랙션

| 원하는 것 | 프롬프트 |
|----------|---------|
| 페이드인 | "스크롤하면 섹션이 페이드인 되게 해줘" |
| 슬라이드업 | "카드가 아래에서 위로 올라오면서 나타나게 해줘" |
| 호버 효과 | "카드에 마우스 올리면 살짝 위로 올라오게 해줘" |
| 호버 확대 | "이미지에 마우스 올리면 살짝 확대되게 해줘" |
| 부드러운 스크롤 | "페이지에 smooth scroll 적용해줘" |
| 타이핑 효과 | "Hero 소개 문구에 타이핑 애니메이션 넣어줘" |
| 페이드 전환 | "섹션 전환 시 부드럽게 페이드되게 해줘" |

---

## 이미지

| 원하는 것 | 프롬프트 |
|----------|---------|
| 배경 이미지 | "Hero에 배경 이미지 넣어줘" |
| 이미지 크기 | "프로젝트 이미지를 전체 폭으로 키워줘" |
| 둥근 모서리 | "이미지 모서리를 둥글게(border-radius: 12px) 해줘" |
| 그림자 | "이미지에 그림자 효과 넣어줘" |
| placeholder | "프로젝트 이미지 자리에 placeholder 넣어줘" |
| 비율 고정 | "이미지 비율을 16:9로 고정해줘" |

---

## 반응형

| 원하는 것 | 프롬프트 |
|----------|---------|
| 기본 반응형 | "모바일에서도 잘 보이게 해줘" |
| 그리드 변환 | "768px 이하에서 2열을 1열로 바꿔줘" |
| 폰트 축소 | "모바일에서 제목 크기를 줄여줘" |
| 메뉴 | "모바일에서 햄버거 메뉴로 바꿔줘" |
| 여백 조정 | "모바일에서 좌우 여백을 16px로 줄여줘" |
| 이미지 크기 | "모바일에서 이미지를 전체 폭으로 해줘" |

---

## 섹션 추가 & 수정

| 원하는 것 | 프롬프트 |
|----------|---------|
| 섹션 추가 | "Work 아래에 수상 경력 섹션 추가해줘" |
| 섹션 삭제 | "Skills 섹션을 삭제해줘" |
| 순서 변경 | "About을 Work 아래로 내려줘" |
| 내비게이션 | "상단에 고정 네비게이션 바 추가해줘" |
| 푸터 | "하단에 저작권 표시 + SNS 링크 넣어줘" |
| 다크모드 | "다크/라이트 모드 토글 버튼 추가해줘" |

---

## 디버깅 & 수정

| 상황 | 프롬프트 |
|------|---------|
| 깨져 보임 | "레이아웃이 깨졌어. 수정해줘" |
| 겹침 | "요소가 겹치고 있어. 간격 조정해줘" |
| 안 보임 | "텍스트가 배경색이랑 같아서 안 보여. 색상 바꿔줘" |
| 느림 | "페이지 로딩이 느려. 이미지 최적화해줘" |
| 되돌리기 | "방금 수정한 거 취소해줘" |
| 전체 되돌리기 | "이전 버전으로 돌려줘" |

---

## 최종 마무리

완성 후 마지막에 요청하면 좋은 것들:

```
1. "코드 정리해줘. 불필요한 부분 삭제하고 깔끔하게"
2. "이미지 최적화하고 로딩 속도 빠르게 해줘"
3. "모든 링크가 새 탭에서 열리게 해줘"
4. "파비콘 추가해줘"
5. "meta 태그 추가해줘 (SEO용 제목, 설명, og:image)"
6. "모바일에서 한번 더 확인해줘. 깨지는 부분 수정"
```