HTML・CSSコーディングするときに役立つサイト

仕事中に「あれ?これってどうするんだっけ」となったときに開くサイトを集めてみました。

CSSレイアウト

CSS三角形作成ツール

CSS三角形作成ツール

疑似要素で三角形を作るときなどに使います。

CSS Flexbox

Flexのチートシートです。とてもお世話になっているサイト。

CSS Flexbox

CSS STRIPE GENERATOR

ストライプの背景を作れます。画像として配置したいときはSVG STRIPE GENERATORもオススメです。

CSS STRIPE GENERATOR

SVG STRIPE GENERATOR

吹き出し

CSS三角形と同じく、毎回忘れがちなのでブクマしてます。

CSSで作る!吹き出しデザインのサンプル19選

フォント・アイコン

Font Awesome 5 Free

Font Awesome 5(Free)

定番のアイコンサイト。フリー版をよく利用します。

Google Font

Google製のwebフォント。webフォント用に最適化されているので導入しやすいです。

Google Font

Google Material Icons

同じくGoogle製のアイコンサイト。シンプルで使いやすいので好き。

Google Material Icons

画像

TinyPNG

画像軽量化サイト。量が多いときはソフトを使いますが、だいたいこれで済ませてます。

TinyPNG

その他

codepen

おなじみ、html・CSS・JSをweb上で編集して共有できるサービス。便利すぎる

codepen

スポンサーリンク

おすすめ本の紹介

直感的にデザインが分かっちゃうスバラシな本です

余白の大事さがギュッとこの一冊で分かっちゃう

WP中級者向け。テーマ作成で役立ちます。

関連記事・広告