「このフォント、何と合わせればいい？」を30組の見本で解決。 Webサイトやバナーを作るとき、いちばん迷うのが「フォントの組み合わせ」。 この見本帳は、Google Fonts で無料公開されている商用利用OKのフォントだけを使って、「見出し × 本文 × 欧文アクセント」の組み合わせを30組まとめたものです。 やさしい・上品・和モダン・ビジネス・ポップ・読みもの・モダン・神秘的など、雰囲気と業種から選べるので、「カフェっぽく」「サロン向けに上品に」といったイメージをそのままフォントに落とし込めます。 各組み合わせには、見本デザイン・推奨サイズ・行間・組み合わせのポイント・配色サンプルと、そのままコピーして使える読み込みタグ（<link>）とCSSが付いています。 付属の「プレビューツール」をブラウザで開けば、自分の文章を入れて見た目を確かめ、コードをワンクリックでコピーできます。 ■ こんな方に ・自分のお店やサービスのサイトを作っている方 ・Web制作・デザインを学び始めた方 ・クライアントへのフォント提案に時間がかかっている方 ・WordPress・STUDIO・HTMLでサイトを作る方 ■ 内容物（zip 約6MB） ・見本帳PDF（A4・34ページ／日本語版・英語版） 　表紙／使い方とフォント選びの基本／30組の見本（1組1ページ）／もっと上手に使うコツ・雰囲気から選ぶ早見表／ライセンス ・プレビューツール（HTML1ファイル） 　組み合わせの切り替え、文章の書きかえ、PC・スマホ表示、配色あり・白背景、見出しサイズ調整、雰囲気で絞り込み・検索、コードのコピー、日本語・英語の画面切り替え ・CSSファイル 31点（組み合わせごと30点＋全部入り1点） ・見本カード画像 30枚（1200×900 PNG） ・一覧データ（CSV・JSON） ・README（日本語・英語）、LICENSE ■ 使い方 1. zipを展開し、02_font-pairing-viewer.html をブラウザで開く（インターネット接続が必要です） 2. 好きな組み合わせを選んで、見本の文章を自分の文章に書きかえて確認 3. 「HTMLの<head>に貼る」「CSSに貼る」のコードをコピーして、自分のサイトに貼り付け ※ PDFだけでも、各ページのコードをコピーして使えます。 ■ 利用規約・ライセンス ・組み合わせ・CSS・プレビューツールは、ご自身やクライアントのWebサイト・制作物に何件でも使えます（商用可・クレジット表記不要）。 ・この商品のファイルそのものの再配布・転売・共有、素材やテンプレートとしての販売は禁止です。 ・掲載フォントはすべて Google Fonts の SIL Open Font License 1.1（商用利用可・2026年10月時点）です。フォント本体は含まれていません（Google Fonts から無料で読み込み・ダウンロードできます）。ご利用前に各フォントの最新のライセンスをご確認ください。 ・見本の文章・店名・色はすべて架空のサンプルです。 ・表示はブラウザ・OS・Google Fonts の更新により変わる場合があります。 haconiwa design