테마 색상 테스트

라이트/다크 모드에서 모든 UI 요소가 테마 색상에 맞게 보이는지 확인하는 페이지입니다.

---

1. 제목 단계

H1 제목

H2 제목

H3 제목

H4 제목

H5 제목

H6 제목

---

2. 텍스트 스타일

• 굵게 (bold)
• 기울임 (italic)
• 굵게 + 기울임
• 취소선 (strikethrough)
• 인라인 코드 (inline code)
• 형광펜 하이라이트 (textHighlight)

---

3. 인용 (blockquote)

인용문입니다. lightgray/배경 대비가 잘 드러나는지 확인하세요. 여러 줄도 가능합니다.

---

4. 콜아웃 (callout)

각 줄 앞에 > (인용)을 붙여야 콜아웃으로 렌더됩니다.

접기 가능한 노트

콜아웃 배경(highlight)과 테두리 색이 잘 보이는지 확인하세요.

Tip

팁 — tertiary/아이콘 색, 배경이 조화롭게 보여야 합니다.

Warning

경고 스타일. 주의를 끌 수 있는 대비가 있는지 봅니다.

Danger

위험/에러 스타일. 강조가 분명한지 확인합니다.

Success

성공/완료 메시지 스타일입니다.

Quote

인용 콜아웃. 다른 콜아웃과 구분되는지 봅니다.

---

5. 목록

글머리 목록

• 항목 1
• 항목 2
  • 중첩 항목 2-1
  • 중첩 항목 2-2
• 항목 3

번호 목록

1. 첫 번째
2. 두 번째
3. 세 번째

할 일 목록

• 미완료 (체크박스)
• 완료 (체크박스)

---

6. 표 (table)

구분	라이트 모드	다크 모드
배경	light	light
본문	dark	dark
보조 텍스트	secondary	secondary
하이라이트	highlight	highlight

---

7. 코드 블록 (문법 강조)

const themeColors = {
  lightMode: {
    light: "#fafaf8",
    dark: "#242420",
    highlight: "rgba(90, 85, 70, 0.12)",
    textHighlight: "#f0d96088",
  },
  darkMode: {
    light: "#181818",
    dark: "#eaeae8",
  },
}

---

8. 머메이드 다이어그램

flowchart LR
  A[라이트] --> B[다크]
  B --> C[테스트]
  C --> A

---

9. 링크

• 위키링크: 위키링크, 마크다운 문법, 그래프 뷰
• 외부 링크: Quartz

---

10. 수식 (LaTeX)

인라인: $E=m{c}^2$

블록:

$$\sum _{i=1}^{n}i=\frac{n(n+1)}{2}$$

---

11. 기타

수평선 위쪽과 아래쪽 텍스트. gray/tertiary 등 보조 색이 구분되는지 확인하세요.

---

이 문서를 라이트/다크 모드에서 열고, 사이드바·헤더·푸터·본문·TOC·백링크·태그 등 전체 화면을 둘러보면 테마 적용 상태를 한 번에 확인할 수 있습니다.