プロフィールリンク集 HTMLテンプレート｜スマホ対応・6カラー（lit.link風 リンクインバイオ）

SNSのプロフィール欄に貼れる「リンク集ページ」を、自分のサイトとして持てるHTML/CSSテンプレートです。

lit.link や Linktree のようなページを、無料ホスティングやレンタルサーバーで自由に運用できます。

■ こんな方におすすめ

・X / Instagram のプロフから、複数のリンクへ1ページで案内したい

・配布サービスに依存せず、自分のドメイン／サーバーでリンク集を持ちたい

・デザインを自分好みに細かく変えたい（広告や他人のロゴが出ないページにしたい）

・クリエイター／配信者／ハンドメイド作家／同人活動の入口ページが欲しい

■ 特徴

・スマホ最適化の中央1カラム（リンクインバイオの定番レイアウト）

・配色テーマ6種同梱（標準＋Aurora／Night／Pastel／Sunset／Mono）→ 1行の変更で切替

・配色はCSS変数で一括管理。数行の編集で自由に色替え可能

・「注目リンク（Featured）」カードで、いちばん見せたいものを最上段に固定

・URLコピー用のシェアボタン内蔵

・依存ライブラリなし（HTML / CSS / 素のJavaScript のみ・ビルド不要）

・Google Fonts 使用（商用利用可）

・アイコンはすべて汎用SVG（特定サービスのロゴ・商標は含みません）

■ 同梱の配色テーマ（6種）

標準 ／ Aurora（鮮やかグラデ）／ Night（ダーク）／ Pastel（淡色）／ Sunset（夕焼け）／ Mono（モノクロ）

■ ページ構成

・プロフィールヘッダー（アバター・名前・@ハンドル・自己紹介・SNSアイコン）

・注目リンク（サムネ付きカード1枚）

・リンクボタン（縦積み・複製で増やせます）

・フッター

■ 同梱ファイル

・index.html … 本体

・css/style.css … デザイン（配色は冒頭の :root を編集）

・js/main.js … テーマ切替・年号更新・シェアボタン

・themes/ … 配色テーマ5種＋一覧プレビュー＋解説（THEMES.md）

・README.md … 日本語の使い方ガイド

・LICENSE.txt … 利用規約

■ 使い方（3ステップ）

1. index.html の【...】を自分の情報に書き換える（リンク名・URL・自己紹介など）

2. 色を変えたい場合は css/style.css の :root か、themes/ のテーマを切り替える

3. フォルダごとサーバーにアップして公開（GitHub Pages / Netlify / レンタルサーバー）

■ 動作環境

モダンブラウザ（Chrome / Edge / Firefox / Safari の最新版）。ビルド・追加ソフト不要。

■ ライセンス概要

個人・商用ともに利用可／改変可／クライアント納品可。

本テンプレート自体の再配布・再販売は不可。詳細は同梱の LICENSE.txt をご確認ください。

■ 注意事項

・画像は含まれません（グラデーションのプレースホルダ内蔵。お好みで差し替え可能）。

・リンク先のサービス名・ブランドの権利は各社に帰属します。アイコンは汎用デザインです。

・購入前にスクリーンショットで仕上がりイメージをご確認ください。

■ 更新履歴

v1.0 初版