Parts & Tips

個人サイトを語ろう Advent Calendar 2025　21日目参加記事 ​

本記事は個人サイトを語ろう Advent Calendar 2025 21日目の記事です。

ヤマツと申します。Parts & Tipsというサイトにて、主に個人サイト制作者の方へ向けて、HTML/CSSのコードサンプルやサイト制作に関する情報などを発信しています。

本記事では、サイト制作の際に役立つまたは便利なサイトや書籍を紹介しています。それでは早速。

色見本 ​

ウェブサイトで利用できるカラーコードやCSSグラデーションの配色見本を掲載しているサイトを紹介しています。

Color Hunt ​

テーマ別で探せる配色サイト。見ているだけでもたのしい。
配色を投稿したり、サイト上でコレクションとしてお気に入り登録も可。

Happy Hues ​

配色サイト。数はそんなに多くないものの、選んだカラーでサイト全体が変更されるので、英語サイトで文字が大きい・行間が広めではあるものの、見た目の全体イメージが掴みやすいとおもいます。
サイトの雰囲気やイラストもかわいく、見た目もかわいいサイト。

uchū ​

HEX値（#からはじまる16進数のカラーコード値）よりもよりきれいな色を表現できるOKLCH値のカラーパレットサイト。名前は日本語の「宇宙」からとのこと。

NIPPON COLORS ​

日本の伝統色に特化した配色サイト。色をクリックすると背景色が変更になるなど、見た目もたのしい。
サイトがレスポンシブ対応はしてないようなので、スマホからだとすこし見づらいかもしれません。

Colorbase ​

通常の色見本のほか、色を指定して近似色などを作成するジェネレーター、色の見え方を確認できるコントラストチェッカーも提供しているサイト。

uiGradients ​

CSSグラデーションの配色見本サイト。種類が豊富です。

CSS Gradient ​

CSSグラデーションのジェネレーター。直感的に操作でき、コードも最低限の構成で生成されます。

CSS Color Filter Generator ​

img要素のsrc属性値に指定したSVG画像の色を変更するCSSのコード（単色のみ）を取得できるサイト。生成されたCSSは、該当のimg要素に対して指定します。

アイコン類 ​

ウェブサイトなどで利用できるアイコンを配布しているサイトです。
個人・商用ともに利用できるものをピックアップしていますが、ご利用の際は各ライセンスをご確認ください。

Phosphor Icons ​

Webフォントとして利用できるシンプルなアイコンサイト。

Pixel Icon Library ​

ピクセルドットのアイコンサイト。
無料プランと有料プランがあり、無料プランではリンクを貼ることが使用の条件となっています。詳細はLicenseをご覧ください。

MingCute Icon ​

それぞれラインと塗りの2パターンがあるシンプルなアイコンサイト。
他のアイコンサイトにないものもけっこうあり、たとえばMisskeyのアイコンもあります。

HTML/CSSリファレンス ​

HTMLやCSSの解説サイトを紹介しています。

MDN Web Docs ​

ブラウザFirefoxを提供しているMozillaが主に運営・管理しているウェブに関するドキュメントサイト。通常MDN。
HTMLやCSS、JavaScriptの属性（プロパティ）値について調べることや正しい使い方を知りたいときは、とりあえずここのリファレンスを参考にするとよいです。ブラウザの対応状況なども掲載されています。

コリス ​

ウェブサイト制作に役立つ情報やTips、海外記事の翻訳や書籍の紹介など、ウェブサイト制作全般について情報を発信しているサイト。

便利ツール ​

ウェブサイト制作に限らず、あるとちょっと便利なツールなどを提供しているサイトを紹介しています。

Can I use... ​

HTMLやCSSなどのブラウザ対応状況を確認できるサイト。

CloudConvert ​

さまざまな形式のファイルを別の形式に変換できるサイト。

Webサイトの利用規約 ​

Webサイト用の「利用規約」「プライバシーポリシー」等のひな型（テンプレート）を掲載しているサイト。個人・法人問わず、無料で商用利用可。

無限ツールズ ​

カラーコード変換やパスワード自動生成など、ウェブサイトはもちろんそれ以外でも役立つツールがたくさん公開されています。

書籍 ​

HTMLやCSSのリファレンス書籍。筆者も参考にしているものです。
※リンク先は出版社の書籍ページです

HTML&CSS全事典 改訂4版 ​

HTML要素とCSSプロパティについて、とてもわかりやすく解説されているリファレンス本です。

改訂新版 HTML&CSSデザインレシピ集 ​

「やりたい（実装したい）こと」から逆引きできるリファレンス本です。実装サンプルが豊富。

以上、サイト制作の際に役立つまたは便利なサイトや書籍のご紹介でした。
つらつらとサイトを紹介するだけの記事となりましたが、ここまでお読みいただきありがとうございました。

蛇足 ​

…と締めたものの、これだけでは味気ないような気もするので。
当サイトで行っているような情報発信の中では、できるかぎり個人の主張や思想を排して記事を書くように努めているのですが（それらがまったく入ってないということはないとおもいますが…）、せっかくアドベントカレンダーの記事なので、昨今の個人サイトに対して感じていることをすこしだけ。

「趣味のサイトを個人で持つ、運用する」ことは、昔に比べると体感としてハードルが高くなっているなと感じています。

サーバー代など金銭的な面やセキュリティ対策などもそうですが、サイトはつくって終わりではないので、運用のためのリソース（運用のための維持管理、続ける体力、やる気やモチベーションなど）をちゃんと確保することができるかどうかということも、ハードルの高さのひとつかなと。

もちろん個人が趣味でやるものなので、企業やサービスが運用するものほど厳格でも気負わなくてもいいものですし、それぞれの事情もあると思いますが、せっかくインターネットの海に放たれたサイトがそのままずっと更新されないというのも、個人サイトが好きな身としてはすこし寂しいなとも感じます。
（そのままサーバーの契約切れでなくなってしまうとか、いつのまにか第三者に改竄されているということもときどき…）

「サイトを持つ、運用する」ことのハードルは少し高いかもしれませんが、個人的にサイトを持つことの一番のメリットは、「周囲の感情に振り回されすぎなくていいこと」と、「サービス（プラットフォーム、それらを提供する企業など）の規約に左右されないこと」かなとも思っています（有償無償問わず、借りているサーバーの規約には従うという前提で）

現状は気軽に「個人サイトつくろうよ」と言えるものでもなく、「個人サイトつくりたい」と思ってもなかなか次の一歩が踏み出せないというようなところもありますが、それでも個人サイトをつくりたいと思って、運用を続けてくれる人たちがゆるやかにでも増えていくといいなと思っています。

本記事の内容は以上です。