Skip to content

Instantly share code, notes, and snippets.

@fujiwara-mu
Created November 28, 2025 04:49
Show Gist options
  • Select an option

  • Save fujiwara-mu/4fd447f8cf7fe04a9067d231a36e3d6b to your computer and use it in GitHub Desktop.

Select an option

Save fujiwara-mu/4fd447f8cf7fe04a9067d231a36e3d6b to your computer and use it in GitHub Desktop.
紅茶セット
<!DOCTYPE html><html lang="ja"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ひかるんへ</title><style>/* --- テーマ:The Art of Tea --- */
/* --- 紅茶の淹方リードミーに捧げる、伝統とモダンが融合したデザイン --- */
/* 格調高い見出し用フォントと、非常に読みやすい本文用フォントをインポート */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500&family=Lato:wght@400;700&display=swap');
:root {
--paper-color: #f9f6f2; /* 日に焼けた上質な紙の色 */
--ink-color: #4a4440; /* 深いセピア色のインク */
--accent-color: #8c4a4a; /* 熟成した紅茶のような赤茶色 */
--border-color: #d6ccc2;
--highlight-bg: #edeae6; /* 強調表示用の背景色 */
--font-heading: 'Playfair Display', 'Noto Serif JP', serif;
--font-body: 'Lato', 'Noto Sans JP', sans-serif;
}
/* --- CSSリセット --- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: var(--font-body);
font-size: clamp(16px, 1rem + 0.2vw, 17px);
background-color: var(--paper-color);
color: var(--ink-color);
line-height: 1.8;
}
.container {
max-width: 750px;
margin: 0 auto;
padding: clamp(24px, 8vw, 60px) 1em;
}
h1, h2, h3, h4, h5, h6 {
font-family: var(--font-heading);
color: var(--accent-color);
margin: 2em 0 0.8em 0;
font-weight: 500;
}
h1 {
font-size: clamp(2.2rem, 1.8rem + 3vw, 3rem);
text-align: center;
border-top: 1px solid var(--border-color);
border-bottom: 1px solid var(--border-color);
padding: 0.5em 0;
margin-top: 0;
}
h2 { font-size: clamp(1.6rem, 1.4rem + 1.5vw, 2rem); }
h3 { font-size: clamp(1.3rem, 1.2rem + 1vw, 1.5rem); }
p {
margin-bottom: 1.2em;
}
/* ユーザーとAIの区別ではなく、一般的なMarkdown要素としてスタイルを定義 */
/* 今回はチャット履歴というより、一つの文書として見せる */
.message { margin-bottom: 1.2em; }
.author-label, .message.user { display: none; } /* チャット形式の要素は非表示 */
.message-content { padding: 0; }
/* 引用ブロック(>)を、重要なTipsや注意書きとしてデザイン */
blockquote {
background-color: var(--highlight-bg);
border-left: 3px solid var(--accent-color);
margin: 1.5em 0;
padding: 1em 1.5em;
}
blockquote p {
margin-bottom: 0;
}
/* リスト(- や 1.)を手順として分かりやすく */
ul, ol {
margin: 1em 0 1.5em 2em;
padding: 0;
}
li {
margin-bottom: 0.5em;
padding-left: 0.5em;
}
a {
color: var(--accent-color);
text-decoration: none;
border-bottom: 1px dotted var(--accent-color);
transition: all 0.2s ease;
}
a:hover {
background-color: var(--accent-color);
color: var(--paper-color);
border-bottom-color: transparent;
}
pre {
background-color: var(--highlight-bg);
border: 1px solid var(--border-color);
padding: 16px;
border-radius: 4px;
overflow-x: auto;
font-family: 'SF Mono', 'Consolas', 'Menlo', monospace;
font-size: clamp(14px, 0.8rem + 0.1vw, 15px);
line-height: 1.6;
margin: 1.5em 0;
}
/* --- 印刷用スタイル --- */
@media print {
@page { size: A4; margin: 2cm; }
:root { --paper-color: #fff; --ink-color: #000; --accent-color: #000; --border-color: #ccc; --highlight-bg: #f0f0f0; }
body { font-family: 'Times New Roman', serif; font-size: 11pt; line-height: 1.5; }
.container { max-width: 100%; padding: 0; margin: 0; }
h1 { font-size: 20pt; text-align: center; border-color: #000; padding: 10px 0; }
a { border-bottom: 1px solid #000; }
a:hover { background: none; color: #000; }
blockquote { border-left-color: #000; }
}</style></head><body class="ai-only"><div class="container"><h1>ひかるんへ</h1><div class="message model"><div class="message-content">リサイクルショップでの紅茶道具探し、宝探しみたいでとても楽しいですよ!<br>初心者さんが「これさえあればリーフ(茶葉)から美味しく淹れられる」という<b>最低限の3点セット</b>と、あると便利なプラスアルファをご紹介します。<br><br>---<br><br><h3>🫖 1. ティーポット(絶対必要)</h3><br><br>これがなくては始まりません。リサイクルショップでは、ブランド食器のコーナーや、雑貨の「カゴ盛り」コーナーによくあります。<br><br><i> <b>選び方のコツ:</b><br> </i> <b>丸い形</b>を選びましょう。お湯の中で茶葉がくるくる回る「ジャンピング」が起きやすくなります。<br> <i> <b>蓋(フタ)</b>がしっかりハマるか確認してください。<br> </i> 茶渋(茶色の汚れ)がひどくないか、中を覗いてチェック!<br><i> <b>目安価格:</b> 300円 〜 800円<br><br><h3>☕ 2. ティーカップ&ソーサー(絶対必要)</h3><br><br>マグカップでも飲めますが、「紅茶を淹れる」体験を楽しむなら、受け皿(ソーサー)付きがおすすめです。<br><br></i> <b>選び方のコツ:</b><br> <i> <b>飲み口が広いもの</b>(浅い形)が紅茶向きです。香りが広がりやすく、色が綺麗に見えます。<br> </i> 内側が<b>白いもの</b>だと、紅茶の水色(すいしょく)が楽しめます。<br> <i> セット崩れの「バラ売り」コーナーにお宝が眠っています。直感で「好き!」と思ったデザインを選んでください。<br></i> <b>目安価格:</b> 100円 〜 500円<br><br><h3>🥄 3. ティースプーン(絶対必要)</h3><br><br>茶葉を計るために使います。カレースプーンだと大きすぎます。<br><br><i> <b>選び方のコツ:</b><br> </i> キッチン用品のワゴンセールによく入っています。<br> <i> 一般的な<b>小さいスプーン</b>なら何でもOKです。少しアンティークっぽい銀色のものが見つかると気分が上がりますよ。<br></i> <b>目安価格:</b> 50円 〜 100円<br><br>---<br><br><h3>🕸️ (補足)茶こし(ストレーナー)</h3><br><br>ここだけ注意です!<br>ポットの中に「網」がついていないタイプを買った場合、茶葉を受け止める「茶こし」が必要です。<br><br><i> <b>アドバイス:</b><br> </i> リサイクルショップの茶こしは網目が歪んでいたり汚れていることが多いです。<br> <i> これだけは<b>100円ショップ</b>で新品を買うのをおすすめします。<br></i> <b>予算:</b> 110円(新品)<br><br>---<br><br><h3>💰 おおよその予算合計</h3><br><br><b>合計:1,000円 〜 1,500円</b><br><br><i> ポット:500円<br></i> カップ:300円<br><i> スプーン:100円<br></i> (茶こし:100円)<br><br>新品で揃えると安くても3,000円〜5,000円はしますので、リサイクルショップならかなりお得に、しかも味のある道具でスタートできます。<br><br><b>💡 最後にワンポイントアドバイス</b><br>リサイクルショップで買った陶器は、使う前に一度、<b>漂白剤(キッチンハイターなど)</b>に浸けると、茶渋や見えない汚れが落ちてピカピカになり、気持ちよく使えますよ!<br><br>素敵な紅茶ライフになりますように!</div></div></div></body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment