기본적으로 타이포그래피 스타일은 제공하지 않습니다. 이 페이지는 유틸리티 클래스를 사용하여 텍스트 스타일을 지정하는 방법의 예제입니다.
웃음에 세금을: 농담세 연대기
옛날 옛적, 먼 나라에 하루 종일 왕좌에 앉아 빈둥거리는 매우 게으른 왕이 있었습니다. 어느 날, 신하들이 문제를 가지고 왔습니다. 왕국의 재정이 바닥나고 있다는 것이었습니다.
왕의 계획
왕은 오랫동안 고심한 끝에 마침내 기발한 계획 을 생각해냈습니다. 왕국의 농담에 세금을 부과하기로 한 것입니다.
"결국," 그가 말했다. "모두가 좋은 농담을 즐기니, 그 특권에 대해 대가를 지불하는 것이 공정하다."
농담세
왕의 백성들은 웃기지 않았습니다. 그들은 투덜거리고 불평했지만, 왕은 확고했습니다:
- 1단계 말장난: 금화 5개
- 2단계 농담: 금화 10개
- 3단계 한 줄 개그: 금화 20개
그 결과 사람들은 농담을 멈췄고, 왕국은 우울에 빠졌습니다. 하지만 왕의 어리석음에 굴복하지 않는 한 사람이 있었습니다. 바로 광대 조크스터였습니다.
조크스터의 반란
조크스터는 한밤중에 성에 몰래 들어가 온 곳에 농담을 남겼습니다. 왕의 베개 밑, 수프 속, 심지어 왕실 화장실에까지. 왕은 분노했지만 조크스터를 막을 수 없었습니다.
그러던 어느 날, 왕국의 백성들은 조크스터가 남긴 농담들이 너무 재미있어서 웃지 않을 수 없다는 것을 발견했습니다. 그리고 한번 웃기 시작하자 멈출 수가 없었습니다.
백성들의 반란
웃음으로 기분이 좋아진 왕국의 백성들은 다시 농담과 말장난을 시작했고, 곧 왕국 전체가 농담에 동참했습니다.
| 왕실 재정 | 백성의 행복 |
|---|---|
| 비어있음 | 넘쳐흐름 |
| 보통 | 만족 |
| 가득참 | 황홀함 |
왕은 백성들이 얼마나 행복해졌는지 보고 자신의 잘못을 깨달아 농담세를 폐지했습니다. 조크스터는 영웅으로 선언되었고, 왕국은 오래오래 행복하게 살았습니다.
이 이야기의 교훈은 이것입니다. 좋은 웃음의 힘을 결코 과소평가하지 말고, 나쁜 아이디어는 항상 조심하세요.
<div>
<h1 class="scroll-m-20 text-4xl font-extrabold tracking-tight text-balance">
웃음에 세금을: 농담세 연대기
</h1>
<p class="text-muted-foreground text-xl leading-7 [&:not(:first-child)]:mt-6">
옛날 옛적, 먼 나라에 하루 종일 왕좌에 앉아 빈둥거리는 매우 게으른 왕이
있었습니다. 어느 날, 신하들이 문제를 가지고 왔습니다. 왕국의 재정이 바닥나고
있다는 것이었습니다.
</p>
<h2
class="mt-10 scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0"
>
왕의 계획
</h2>
<p class="leading-7 [&:not(:first-child)]:mt-6">
왕은 오랫동안 고심한 끝에 마침내
<a href="##" class="text-primary font-medium underline underline-offset-4">
기발한 계획
</a>
을 생각해냈습니다. 왕국의 농담에 세금을 부과하기로 한 것입니다.
</p>
<blockquote class="mt-6 border-s-2 ps-6 italic">
"결국," 그가 말했다. "모두가 좋은 농담을 즐기니, 그 특권에
대해 대가를 지불하는 것이 공정하다."
</blockquote>
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">농담세</h3>
<p class="leading-7 [&:not(:first-child)]:mt-6">
왕의 백성들은 웃기지 않았습니다. 그들은 투덜거리고 불평했지만, 왕은
확고했습니다:
</p>
<ul class="my-6 ms-6 list-disc [&>li]:mt-2">
<li>1단계 말장난: 금화 5개</li>
<li>2단계 농담: 금화 10개</li>
<li>3단계 한 줄 개그: 금화 20개</li>
</ul>
<p class="leading-7 [&:not(:first-child)]:mt-6">
그 결과 사람들은 농담을 멈췄고, 왕국은 우울에 빠졌습니다. 하지만 왕의
어리석음에 굴복하지 않는 한 사람이 있었습니다. 바로 광대 조크스터였습니다.
</p>
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
조크스터의 반란
</h3>
<p class="leading-7 [&:not(:first-child)]:mt-6">
조크스터는 한밤중에 성에 몰래 들어가 온 곳에 농담을 남겼습니다. 왕의 베개
밑, 수프 속, 심지어 왕실 화장실에까지. 왕은 분노했지만 조크스터를 막을 수
없었습니다.
</p>
<p class="leading-7 [&:not(:first-child)]:mt-6">
그러던 어느 날, 왕국의 백성들은 조크스터가 남긴 농담들이 너무 재미있어서
웃지 않을 수 없다는 것을 발견했습니다. 그리고 한번 웃기 시작하자 멈출 수가
없었습니다.
</p>
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
백성들의 반란
</h3>
<p class="leading-7 [&:not(:first-child)]:mt-6">
웃음으로 기분이 좋아진 왕국의 백성들은 다시 농담과 말장난을 시작했고, 곧
왕국 전체가 농담에 동참했습니다.
</p>
<div class="my-6 w-full overflow-y-auto">
<table class="w-full">
<thead>
<tr class="even:bg-muted m-0 border-t p-0">
<th
class="border px-4 py-2 text-start font-bold [&[align=center]]:text-center [&[align=right]]:text-end"
>
왕실 재정
</th>
<th
class="border px-4 py-2 text-start font-bold [&[align=center]]:text-center [&[align=right]]:text-end"
>
백성의 행복
</th>
</tr>
</thead>
<tbody>
<tr class="even:bg-muted m-0 border-t p-0">
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
비어있음
</td>
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
넘쳐흐름
</td>
</tr>
<tr class="even:bg-muted m-0 border-t p-0">
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
보통
</td>
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
만족
</td>
</tr>
<tr class="even:bg-muted m-0 border-t p-0">
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
가득참
</td>
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
황홀함
</td>
</tr>
</tbody>
</table>
</div>
<p class="leading-7 [&:not(:first-child)]:mt-6">
왕은 백성들이 얼마나 행복해졌는지 보고 자신의 잘못을 깨달아 농담세를
폐지했습니다. 조크스터는 영웅으로 선언되었고, 왕국은 오래오래 행복하게
살았습니다.
</p>
<p class="leading-7 [&:not(:first-child)]:mt-6">
이 이야기의 교훈은 이것입니다. 좋은 웃음의 힘을 결코 과소평가하지 말고, 나쁜
아이디어는 항상 조심하세요.
</p>
</div> h1
웃음에 세금을: 농담세 연대기
<h1 class="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl">
웃음에 세금을: 농담세 연대기
</h1> h2
왕국의 백성들
<h2
class="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0"
>
왕국의 백성들
</h2> h3
농담세
<h3 class="scroll-m-20 text-2xl font-semibold tracking-tight">농담세</h3> h4
사람들은 농담을 멈췄습니다
<h4 class="scroll-m-20 text-xl font-semibold tracking-tight">
사람들은 농담을 멈췄습니다
</h4> p
왕은 백성들이 얼마나 행복해졌는지 보고 자신의 잘못을 깨달아 농담세를 폐지했습니다.
<p class="leading-7 [&:not(:first-child)]:mt-6">
왕은 백성들이 얼마나 행복해졌는지 보고 자신의 잘못을 깨달아 농담세를
폐지했습니다.
</p> blockquote
"결국," 그가 말했다. "모두가 좋은 농담을 즐기니, 그 특권에 대해 대가를 지불하는 것이 공정하다."
<blockquote class="mt-6 border-s-2 ps-6 italic">
"결국," 그가 말했다. "모두가 좋은 농담을 즐기니, 그 특권에 대해 대가를
지불하는 것이 공정하다."
</blockquote> table
| 왕실 재정 | 백성의 행복 |
|---|---|
| 비어있음 | 넘쳐흐름 |
| 보통 | 만족 |
| 가득참 | 황홀함 |
<div class="my-6 w-full overflow-y-auto">
<table class="w-full">
<thead>
<tr class="even:bg-muted m-0 border-t p-0">
<th
class="border px-4 py-2 text-start font-bold [&[align=center]]:text-center [&[align=right]]:text-end"
>
왕실 재정
</th>
<th
class="border px-4 py-2 text-start font-bold [&[align=center]]:text-center [&[align=right]]:text-end"
>
백성의 행복
</th>
</tr>
</thead>
<tbody>
<tr class="even:bg-muted m-0 border-t p-0">
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
비어있음
</td>
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
넘쳐흐름
</td>
</tr>
<tr class="even:bg-muted m-0 border-t p-0">
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
보통
</td>
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
만족
</td>
</tr>
<tr class="even:bg-muted m-0 border-t p-0">
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
가득참
</td>
<td
class="border px-4 py-2 text-start [&[align=center]]:text-center [&[align=right]]:text-end"
>
황홀함
</td>
</tr>
</tbody>
</table>
</div> list
- 1단계 말장난: 금화 5개
- 2단계 농담: 금화 10개
- 3단계 한 줄 개그: 금화 20개
<ul class="my-6 ms-6 list-disc [&>li]:mt-2">
<li>1단계 말장난: 금화 5개</li>
<li>2단계 농담: 금화 10개</li>
<li>3단계 한 줄 개그: 금화 20개</li>
</ul> 인라인 코드
@lucide/svelte<code
class="bg-muted relative rounded px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold"
>
@lucide/svelte
</code> 리드 텍스트
중요한 콘텐츠로 사용자를 중단시키고 응답을 요구하는 모달 다이얼로그입니다.
<p class="text-muted-foreground text-xl">
중요한 콘텐츠로 사용자를 중단시키고 응답을 요구하는 모달 다이얼로그입니다.
</p> 큰 텍스트
<div class="text-lg font-semibold">정말로 확실하십니까?</div> 작은 텍스트
<small class="text-sm leading-none font-medium">이메일 주소</small> 흐린 텍스트
이메일 주소를 입력하세요.
<p class="text-muted-foreground text-sm">이메일 주소를 입력하세요.</p>