Heading 1
Heading 2
Heading 3
Heading 4
기본 본문
인용구
왼쪽에 회색 선이 생기며, 기울어진 폰트 스타일입니다.
굵은 글씨, 기울임, 취소선
- 굵게
- 기울임
-
취소선
리스트
순서 없는 리스트
- 첫 번째 항목
- 두 번째 항목
- 하위 항목
- 더 깊은 항목
- 하위 항목
순서 있는 리스트
- 첫 번째 단계
- 두 번째 단계
- 하위 단계
- 또 다른 하위 단계
코드 블록 (Dracula Theme)
const greet = (): string => {
return "Hello, World";
};인라인 스타일링
<mark> 태그: 강조하고 싶은 문장 하이라이팅
<code> 태그: 인라인 코드
링크
테이블
| 태그 | 설명 | 역할 |
|---|---|---|
| <table> | 표 전체 컨테이너 | 데이터를 행과 열의 형태로 보여줌 |
| <thead> | 표의 머리말 | 열의 제목 행을 정의함 |
| <tbody> | 표의 본문 | 실제 데이터 행을 담음 |
| <tfoot> | 표의 바닥글 (선택) | 요약 또는 총합 같은 정보를 제공 |
| <tr> | 하나의 행(Row) | 하나의 수평 줄을 구성 |
| <th> | 헤더 셀 (굵은 글씨, 가운데 정렬) | 열 제목을 나타냄 |
| <td> | 일반 데이터 셀 | 표의 내용을 구성하는 셀 |
컬러 시스템
| 토큰 | 색상 | Hex | 설명 |
|---|---|---|---|
| primary | #4f46e5 | 메인 강조 색상 (로고, 버튼 등) | |
| primary-foreground | #ffffff | primary 위에 올라갈 텍스트 색상 | |
| background | #f8fafc | 기본 배경 색상 |
폰트 시스템
| 토큰 | 폰트명 | 예시 | 용도 |
|---|---|---|---|
| font-sans | "Pretendard" | 기본 폰트 | 본문 및 UI 기본 폰트 |
| font-mono | "IBM Plex Mono" | IBM Plex Mono 예시 | 코드 블록 및 인라인 코드 |
| font-display | "Space Grotesk" | Space Grotesk 예시 | BitBetter 로고 |
이 문서는 BitBetter의 마크다운 스타일을 한눈에 보여주기 위해 작성되었습니다.