HTML / CSS

クロノドライブ HTML辞典	HTML4.01だが、説明が見やすい。
MDN HTML 要素リファレンス	html要素。ブラウザーの互換性も見れる。
The W3C Markup Validation	HTMLバリデーション（文法）チェック
The W3C CSS Validation	CSSバリデーション（文法）チェック
HTML5ガイドライン	見やすいHTML5ガイドライン
CSSガイドライン	見やすいCSSガイドライン
CSSアーキテクチャ（前編）  （後編）	CSS設計の種類が見やすい
HTML特殊文字変換ツール	HTML特殊文字をコードに変換
CSS Compressor	オンライン上でソースコード整形
Fluid-responsive font-size calculator	レスポンシブ対応のフォントサイズを簡単に定義できるオンラインツール
What The Font	似ているフォントを探す
What Font Is	似ているフォントを探す（基本的に有料フォントのみ）
HTML Imagemap Generator	クリッカブルマップが作成できるオンラインツール
WebTech	技術別にフォーカスした日本国内のWebサイト参考ギャラリー
HeaderLove	ヘッダーにフォーカスした日本国内のWebサイト参考ギャラリー

Javascript

jQuery → JavaScript コンバーター	ありそうでここしかないjQuery → JavaScriptへの変換ツール。
phpの変数をjavascript(jQuery)で処理する方法	シンプルでわかりやすいjavascript・jQuary：functionの書き方

WordPress / PHP

Plusers	WordPressオリジナルテーマ解説：書籍並みに詳しく、サンプルコードもあり。
はじめてのWPまとめ	WordPressオリジナルテーマ解説。
Flatsystems PHP Beautifier	オンライン上でPHPソースコード整形

Color

原色大辞典	カラーネーム。
Adobe Color	カラーパターン作成
Coolors	カラーパターン作成
Paletton	カラースキーム作成
Color Blender	2つの色の中間色作成
Mobile Palette Generator	メインカラーを設定するだけで、セカンダリカラー・アクセントカラーの3色パレットを生成するツール。
Instant Background Color	背景色の濃さを文字色に合わせて自動で調節
uiGradients	グラデーションサンプル。大まかな色別、クリックでのCSSコピー等ここが一番使いやすい。
CSS Gradient	グラデーション作成。
CSS Gradient Animator	時間と共にアニメーションするグラデーション作成。

IMAGE（画像）

Placehold.jp	シンプルなダミー画像作成
placekitten	ダミー画像作成（猫）
Lorem Picsum	ダミー画像作成（Unsplash）
ぱくたそ	写真素材（人物豊富）
写真AC	写真素材
Textures.com	テクスチャー・背景素材
PicWish	AIによる自動背景切り抜き（サイズ大で精度も高い）
「ペイント3D」での切り抜き	Windows10の「ペイント3D」を使い、画像内の人物や物体を半自動で切り抜く
SVG Pattern Maker	シンプルな背景パターンを作成、ダウンロード
haikei.app	背景パターンを作成、ダウンロード
Patterncooler	背景パターンをダウンロード
Pngyu	一括画像圧縮フリーソフト（PNG減色化／Windows・Mac）
PNGGauntlet	一括画像圧縮フリーソフト（PNG・JPG最適化／Windows）
ImageOptim	一括画像圧縮フリーソフト（PNG・JPG最適化／Mac）
Jpeg.io	EPS他、様々なファイル形式に対応しているオンライン画像圧縮サイト。対応ファイル形式：EPS、PSD、JPG、PNG、GIF、BMP、TIFF、WebP。
Print1	縦長画像を程よくA4サイズに分割して印刷できる

illustration（イラスト）

ソコスト	商用可・フリーイラスト素材
shigureni	素朴でかわいい女の子のイラスト素材サイト
Loose Drawing	無料で商用可のフリーイラスト素材
Linustock	シンプルな線画イラスト素材
ベクターシェルフ	無料・商用利用OKのイラスト素材サイト
ハンコでアソブ	ハンコ調のイラスト
Illustration Kit	クレジット表記不要で自由に使えるオープンソースのイラスト配布プロジェクト
unDraw	クレジット表記不要のイラスト素材サイト（商用利用可）
drawkit logo	クレジット表記不要のイラスト素材サイト（商用利用可）
Scale	クレジット表記不要のイラスト素材サイト（商用利用可）
Stock Material	クレジット表記不要のイラスト素材サイト（商用利用可）
Delesign	クレジット表記不要のイラスト素材サイト（商用利用可）
Open Peeps	表情や髪型、ポーズなどを組み合わせてオリジナルのキャラクターを作れるサイト

ICON（アイコン）

Icongram	ライブラリ本体設置なしで、URLから1個単位でアイコンを使用できる（「Material Design Icons」「font awesome」「Simple Icons」もあり）
Material Symbols	Googleの太さや塗りを変えられるアイコン。
Simple Icons	ブランドアイコンが豊富（日本国内のhatenaやpixiv等のロゴもあり）。
webサイトの公式ロゴ素材まとめ	ブランドロゴページと色のまとめ
IcoMoon	SVG画像からWEBフォント化
icon rainbow	アイコンをダウンロード
ICOOON MONO	アイコンをダウンロード
FLAT ICON DESIGN	カラーアイコンをダウンロード

LOGO / SHAPE（ロゴ・図形）

LOGASTER	無料で使えるお手軽かんたんロゴジェネレーター（※透かしあり）
Brandmark Logo Maker	AIロゴメーカー
テキストロゴ・アイコン画像作成メーカー・ツール	テキストから、かんたんなアイコン画像作成
フキダシデザイン	フキダシをダウンロード
FRAME Design（フレームデザイン）	1000以上の飾り枠のある素材サイト
CSS三角形作成ツール	シンプルなCSS三角形作成ジェネレーター
CSS吹き出しジェネレーター | Webspe Tools	かなり細かく設定できて、使い方もわかりやすい吹き出しジェネレーター
Basic Pattern Repository	シンプルで使いやすそうなSVGパターン集
Underline Generator	シンプルで使いやすそうなアンダーライン・マーカージェネレーター。
works-thumbnail-generator	かんたんモックアップ画像作成ジェネレーター。

LIBRARY（ライブラリ・コンポーネント）

HAMBURGERS	クラス名だけでハンバーガーアイコン
headers.css	17種類のヘッダーデザインまとめ
HeaderLove	ヘッダーデザインの参考色々
box-shadow examples	コピペでそのまま使える、box-shadowのサンプル集
CSS Arrow Please	CSSフキダシ ジェネレーター
Neumorphism.io	Neumorphism（ニューモーフィズム）を確認しながら調整できるオンラインツール。
Glass Morphism	Glass Morphism（グラスモーフィズム）を確認しながら調整できるオンラインツール。
ウェブ地図を使う際の注意点などまとめ	OpenStreetMapと地図サービスについてのまとめ記事
OpenStreetMapで画像化	「OpenStreetMap」と「まち歩きマップメーカー」を利用した地図のSVG化記事
city roads	「OpenStreetMap」と「まち歩きマップメーカー」を利用した地図のライン化

ANIMATION（アニメーション）

Hover.css	お手軽CSSアニメーションライブラリ。
Animista	ジェネレーターで使えるCSSアニメーションサイト。
Imagehover.css	シンプルなclassで使える画像向けhoverライブラリ。
hoverエフェクト28選 | SONICMOOV LAB	コピペで使えるhoverサンプル集。
Moving Letters	anime.jsを使用したテキストエフェクト集。
textillate.js	クラスで使えるテキストアニメーションライブラリ。
SpinKit | Simple CSS Spinners	コピペで使えるシンプルなローディングスピナー。

MOVIE（動画）

CMAN テキスト→音声変換	商用利用できるテキスト→音声への変換サイト。速度:-1にすると「音読さん」と同じくらいになる。
音読さん	商用利用できるテキスト→音声への変換サイト。（※無料利用は要クレジット、月5000字まで）
D-elf.com	イベント・ナレーション等向きの商用利用可のフリー音楽サイト（※要クレジット）
Mixkit	無料で使えるフリーのpremiereテンプレート集

ANALYTICS（SEO・アナリティクス）

Meta Tags	metaタグをまとめて生成（解説）
favicon.io	pngからファビコン作成
GT metrix（解説）	ページ表示速度と改善点をチェック

Naming, Text

CSSのクラス名を決めるときに使うリスト	レイアウトclass名の参考に（Qiita）
プログラミングでよく使う英単語のまとめ	レイアウトclass名の参考に（Qiita）
本の部分の英語名称メモ	レイアウトclass名の参考に、本の部位の英単語について詳しい。
アンティーク辞典 | GEOGRAPHICA	レイアウトclass名の参考に、家具の名称の英単語について詳しい。
Medical Terminology 体の部位	レイアウトclass名の参考に、身体の部位の英単語について詳しい。
Classnames	レイアウトclass名の参考に
terminology01	動物分類学に関するおもな用語
五か国語対訳音楽用語一覧	日本語から引ける五か国語対応の対訳一覧
emmetチートシート	emmet記法の一覧。略語のまとめとしても。
All Acronyms	略語、頭字語の検索サイト。投票数がある。
Acronym Finder	略語、頭字語の検索サイト
天才英単語 | 英単語の覚え方辞典	英語の類語・語源等に詳しい
英語の違い図鑑	クラス名で使えそうな英単語のまとめ
ja.ilovetranslation.com	日本語から、→ ラテン語に翻訳
lingvanex.com	日本語から、→ ラテン語に翻訳
青空文庫の猫たち	ダミーテキスト用。
Unicode 囲み英数字 - CyberLibrarian	囲み英数字。
Unicode 幾何学模様 - CyberLibrarian	○（丸）、△（三角）、□（四角）他、記号。
Unicode その他の記号及び矢印 - CyberLibrarian	⬅➡（矢印）他、その他の記号。
kiyaku.jp	Webサイト用の「利用規約」「プライバシーポリシー」等のひな型（雛形・テンプレート）を掲載（無料・商用利用可）。

OTHER（その他）

VS Code ショートカット	キーボードショートカットリストの日本語訳
Emmetのアクションまとめ	Emmetのアクション一覧。ここが見やすい。